<template>
    <!-- 人员管理-实名制-人员信息 -->
    <div class="emp">
        <div class="content">
            <div class="left">
                <div class="ipt">
                    <Input search enter-button placeholder="请输入关键字" style="width:200px" @on-search="onSecach" @on-enter="onSecach" v-model="groupkeyword" clearable />
                </div>
                <div class="ipt" style="border-bottom :none; height:50px;">
                    <el-button size="small" plain @click="addClass()" type="primary">添加班组</el-button>
                </div>
                <div class="tree">
                    <el-tree
                        :data="listTreeData" ref="tree"
                        @node-click="getTreeId"
                        :default-expanded-keys="[0]"
                        node-key="id"
                    ></el-tree>
                </div>
            </div>
            <div class="right">
                <div class="top">
                    <div class="search">
                        <div class="list">
                            <ul class="ulbox">
                                <li
                                    v-for="(item, index) in postStatelist"
                                    :key="item.id"
                                    :class="item.id == postState ? 'active' : ''"
                                    @click="getPostType(item)"
                                >
                                    {{ item.name }}({{ numList[index] }})
                                </li>
                            </ul>
                        </div>
                        <div class="list">
                            <Select v-model="bindFlag" style="width:120px" placeholder="安全帽:全部">
                                <Option v-for="item in bindFlagList" :value="item.id" :key="item.id" >{{ item.name }}</Option>
                            </Select>
                            <input type="password" autocomplete="new-password" style="display: none" />
                        </div>
                        <div class="list">
                            <Select v-model="workId" style="width:120px" placeholder="工种:全部">
                                <Option v-for="item in workList" :value="item.workTypeId" :key="item.workTypeId" >{{ item.workTypeName }}</Option>
                            </Select>
                            <input type="password" autocomplete="new-password" style="display: none" />
                        </div>
                        <div class="list">
                            <Select v-model="workRole" style="width:120px" placeholder="工人类型:全部">
                                <Option v-for="item in workerTypeList" :value="item.id" :key="item.id" >{{ item.name }}</Option>
                            </Select>
                            <input type="password" autocomplete="new-password" style="display: none" />
                        </div>
                        <div class="list">
                            <Input v-model="keyword" placeholder="人员姓名搜索" style="width:120px" clearable  />
                            <input type="password" autocomplete="new-password" style="display: none" />
                        </div>
                        <div class="list" @click="onSerch">
                            <Button type="primary">搜索</Button>
                        </div>
                        <div class="list" @click="onReset">
                            <Button>重置</Button>
                        </div>
                    </div>
                    <div class="down">
                        <el-button
                            :type="!btnList.includes('emp/list/add') ? 'info' : 'primary'"
                            @click="updateRow(0)"
                            :disabled="!btnList.includes('emp/list/add')"
                            size="small"
                            icon="el-icon-plus"
                            style="margin-right:10px;">
                            人员
                        </el-button>
                        <el-dropdown split-button size="small" type="primary" style="margin-right:10px;" >
                            导入
                            <input
                                ref="uploadEmpFile"
                                type="file"
                                @change="batchImport"
                                accept=".xlsx,.xls"
                                style="position: absolute;left:0;top:0;height:30px;opacity: 0; width:56px;"
                                clearable
                            />
                            <el-dropdown-menu slot="dropdown">
                                <el-dropdown-item @click.native="templateDownload" >模板下载</el-dropdown-item>
                            </el-dropdown-menu>
                        </el-dropdown>
                        <el-button type="primary" @click="downloadExcel" size="small" >导出</el-button>
                        <el-button :disabled="batchList.length == 0" type="primary" @click="outerModal" size="small" >离职</el-button>
                    </div>
                </div>
                <div class="bottom">
                    <el-table :data="list" :height="tableHeight" :stripe="true" @selection-change="handleSelectionChange">
                        <el-table-column type="selection" width="45">
                        </el-table-column>
                        <el-table-column label="序号" width="70px">
                            <template slot-scope="scope">
                                <span>{{ pageNum == 1 ? scope.$index + 1 : (pageNum - 1) * pageSize + scope.$index + 1 }}</span>
                            </template>
                        </el-table-column>
                        <el-table-column prop="avatar" label="用户头像">
                            <template slot-scope="scope">
                                <div class="demo-image__preview">
                                    <el-image
                                        :src="scope.row.avatar == '' || !scope.row.avatar ? crew.src : scope.row.avatar"
                                        style="display:block;width:45px;height:45px;border-radius:50%"
                                        :preview-src-list="[scope.row.avatar == '' || !scope.row.avatar ? crew.src : scope.row.avatar]"
                                    ></el-image>
                                </div>
                            </template>
                        </el-table-column>
                        <el-table-column prop="empName" label="姓名">
                            <template slot-scope="scope">
                                <span style="color:#0EA16F">{{ scope.row.empName }}</span>
                            </template>
                        </el-table-column>
                        <el-table-column prop="gender" label="性别">
                            <template slot-scope="scope">
                                <span v-if="scope.row.gender == 1" >男</span>
                                <span v-if="scope.row.gender == 2" >女</span>
                            </template>
                        </el-table-column>
                        <el-table-column prop="age" label="年龄" ></el-table-column>
                        <el-table-column prop="groupName" label="班组" ></el-table-column>
                        <el-table-column prop="workRoleName" label="工人类型" ></el-table-column>
                        <el-table-column p rop="workTypeName" label="工种" width="120px" ></el-table-column>
                        <el-table-column prop="postState" label="安全帽绑定" width="120px" >
                            <template slot-scope="scope">
                                <div v-if="scope.row.bindFlag == 0">
                                    <el-tag type="info" size="small" >未绑定</el-tag>
                                </div>
                                <div v-if="scope.row.bindFlag == 1">
                                    <el-tag type="success" size="small" >已绑定</el-tag>
                                </div>
                            </template>
                        </el-table-column>
                        <el-table-column prop="postState" label="在职状态" width="100" >
                            <template slot-scope="scope">
                                <el-tag type="info" v-if="scope.row.postState == 2" size="small" >离职</el-tag>
                                <el-tag type="success" v-if="scope.row.postState == 1" size="small" >在职</el-tag>
                            </template>
                        </el-table-column>
                        <el-table-column prop="syncState" label="同步状态">
                            <template slot-scope="scope">
                                <el-tag type="info" size="small" v-if="scope.row.syncState == 0" >未同步</el-tag>
                                <el-tag type="success" size="small" v-if="scope.row.syncState == 1" >已同步</el-tag>
                            </template>
                        </el-table-column>
                        <el-table-column label="操作" width="220" align="center" >
                            <template slot-scope="scope">
                                <el-button
                                    @click.native.prevent="getDetails(scope.$index, list)"
                                    type="text"
                                    size="small"
                                    v-preventReClick="1500"
                                    >详情</el-button
                                >
                                <el-button
                                    v-if="scope.row.postState == 2"
                                    :disabled="!btnList.includes('emp/list/enter')"
                                    @click.native.prevent="enter(scope.$index, list)"
                                    type="text"
                                    size="small"
                                    >入职</el-button>
                                <el-button
                                    v-if="scope.row.postState == 1"
                                    :disabled="!btnList.includes('emp/list/outer')"
                                    @click.native.prevent="outer(scope.$index, list)"
                                    type="text"
                                    size="small"
                                    >离职</el-button>
                                <el-button
                                    v-if="!scope.row.sn"
                                    :disabled="!btnList.includes('emp/list/bind') || scope.row.postState == 2"
                                    @click.native.prevent="bind(scope.$index, list)"
                                    type="text"
                                    size="small"
                                    >绑定</el-button>
                                <el-button
                                    v-if="scope.row.sn"
                                    :disabled="!btnList.includes('emp/list/unbind')"
                                    @click.native.prevent="unbind(scope.$index, list)"
                                    type="text"
                                    size="small"
                                    >解绑</el-button>
                                <el-button
                                    :style="!btnList.includes('emp/list/del') ? 'color:#C0C4CC' : 'color:red'"
                                    :disabled="!btnList.includes('emp/list/del')"
                                    @click.native.prevent="remove(scope.$index, list)"
                                    type="text"
                                    size="small"
                                    >删除</el-button>

                                <el-button
                                    v-if="btnList.includes('emp/list/sync')"
                                    @click.native.prevent="handleSync(scope.row)"
                                    type="text"
                                    size="small"
                                    >同步</el-button>
                                    <!-- v-if="btnList.includes('emp/user/create')" -->
                                <el-button

                                    @click.native.prevent="createEmpUser(scope.row)"
                                    type="text"
                                    size="small"
                                    >{{scope.row.hasSysUserInfo === false ? '绑定账号' : '更新账号'}}</el-button>
                            </template>
                        </el-table-column>
                    </el-table>
                    <Page
                        v-if="totalCount"
                        style="margin-top: 10px;text-align: center;"
                        :current.sync="current"
                        :total="totalCount"
                        :page-size="pageSize"
                        show-elevator
                        show-total
                        show-sizer
                        @on-change="pageChange"
                        @on-page-size-change="pageSizeChange"
                    ></Page>
                </div>
            </div>
        </div>
        <!-- 添加班组 -->
        <Modal v-model="updateModal" title='添加班组' :mask-closable="false">
            <div>
                <h2>基础信息</h2>
                <div class="baseItem">
                    <span class="tip">*</span>
                    <span>合作单位:</span>
                    <Select v-model="corpType" style="width:300px" placeholder="请选择合作单位">
                        <Option v-for="(item,index) in corpEmpList" :value="item.corpId" :key="index" >{{item.corpName}}</Option>
                    </Select>
                </div>
                <div class="baseItem">
                    <span class="tip">*</span>
                    <span>班组名称:</span>
                    <Input v-model="groupName" placeholder="请输入班组名称"  style="width: 300px" clearable />
                </div>
                <div class="baseItem">
                    <span>班组编码:</span>
                    <Input v-model="groupCode" placeholder="请输入班组编码"  style="width: 300px" clearable />
                </div>
                <div class="baseItem">
                    <span>工种:</span>
                    <Select v-model="workTypeId" style="width:300px" placeholder="请选择工种" @on-change="getGroupWorkType">
                        <Option v-for="item in workTypelist" :value="item.workTypeId" :key="item.workTypeId" >{{ item.workTypeName }}</Option>
                    </Select>
                </div>
                <h2>责任人信息</h2>
                <div class="baseItem">
                    <span>责任人名称:</span>
                    <Input v-model="responsiblePersonName" placeholder="请输入责任人名称"  style="width: 300px" clearable />
                </div>
                <div class="baseItem">
                    <span>电话号码:</span>
                    <Input v-model="responsiblePersonPhone" placeholder="请输入电话号码"  style="width: 300px" clearable />
                </div>
                <div class="baseItem">
                    <span>证件类型:</span>
                    <Select v-model="responsibleIdcardType" style="width:300px" placeholder="请选择证件类型">
                        <Option v-for="(item,index) in cardList" :value="item.id" :key="index">{{item.name}}</Option>
                    </Select>
                </div>
                <div class="baseItem">
                    <span>证件号码:</span>
                    <Input v-model="responsibleIdcardNumber" placeholder="请输入证件号码"  style="width: 300px" clearable />
                </div>
                <h2>硬件信息</h2>
                <div class="baseItem">
                    <span>视频设备:</span>
                    <Cascader :data="fvsList" v-model="fvsDeviceId" filterable trigger="hover" placeholder="请选择" style="width:300px;" @on-change="getFvsDeviceName"></Cascader>
                </div>
            </div>
            <div slot="footer">
                <el-button @click="updateModal=false" type="info" size="small" plain>取消</el-button>
                <el-button @click="submitClass" type="primary" size="small" plain v-preventReClick="1500">保存</el-button>
            </div>
        </Modal>

        <!-- 新增人员 -->
        <Modal v-model="updateModel" title="新增人员" :mask-closable="false" width="1100px;" >
            <div class="update">
                <div class="left">
                    <div class="tags" style="margin-bottom:10px">
                        <div class="title">
                            <h2>基本信息</h2>
                            <!-- <button class="btn" @click="getIDCard" v-if="CertificateType == 1" >
                                <img src="./../../assets/images/emp/list/base_readCard.png" />
                                <span>读取身份证信息</span>
                            </button> -->
                        </div>
                        <div class="list">
                            <div class="item" style="width:100%">
                                <span class="tip">*</span>
                                <span class="span1">证件类型:</span>
                                <Select v-model="CertificateType" style="width:512px" @on-change="getCertificateType" >
                                    <Option v-for="item in CertificateTypeList" :value="item.id" :key="item.id" >{{ item.name }}</Option>
                                </Select>
                            </div>
                        </div>
                        <div class="list">
                            <div class="item">
                                <span class="tip">*</span>
                                <span class="span1">姓名:</span>
                                <Input v-model.trim="crew.name" placeholder="请输入姓名" :maxlength="length" show-word-limit style="width: 200px" clearable />
                            </div>
                            <div class="item">
                                <span class="span1">电话:</span>
                                <Input v-model="crew.phone" placeholder="请输入电话" style="width: 200px" clearable />
                            </div>
                        </div>
                        <div class="list">
                            <div class="item">
                                <span class="tip">*</span>
                                <span class="span1">性别:</span>
                                <div class="radio">
                                    <el-radio-group v-model="crew.gender">
                                        <el-radio :label="1">男</el-radio>
                                        <el-radio :label="2">女</el-radio>
                                    </el-radio-group>
                                </div>
                            </div>
                            <div class="item">
                                <span class="span1">学历:</span>
                                <Select v-model="crew.education" style="width:200px" placeholder="请选择学历" >
                                    <Option v-for="item in educationList" :value="item.id" :key="item.id" >{{ item.name }}</Option>
                                </Select>
                            </div>
                        </div>
                        <div class="list">
                            <div class="item" v-if="CertificateType == 1">
                                <span class="span1">民族:</span>
                                <Select v-model="crew.nation" style="width:200px" placeholder="请选择民族" @on-change="getethnicType" >
                                    <Option v-for="(item, index) in ethnicList" :value="item" :key="index" >{{ item }}</Option>
                                </Select>
                            </div>
                            <div class="item" v-if=" CertificateType != 1 && CertificateType != 5" >
                                <span class="span1">出生日期:</span>
                                <DatePicker type="date" placeholder="请选择出生日期" style="width: 200px" v-model="crew.birthday" :clearable="false" ></DatePicker>
                            </div>
                            <div class="item" v-if="CertificateType == 5">
                                <span class="span1" v-if="CertificateType == 5" >证件号码:</span>
                                <Input v-model="crew.idCardNo" placeholder="请输入证件号码" style="width: 200px" clearable />
                            </div>
                            <div class="item">
                                <span class="span1">学位:</span>
                                <Select v-model="crew.degree" style="width:200px" placeholder="请选择学位" >
                                    <Option v-for="item in degreeList" :value="item.id" :key="item.id" >{{ item.name }}</Option>
                                </Select>
                            </div>
                        </div>
                        <div class="list" v-if="CertificateType == 1">
                            <div class="item" style="width:100%">
                                <span class="span1">出生日期:</span>
                                <DatePicker type="date" placeholder="请选择出生日期" style="width: 512px" v-model="crew.birthday" :clearable="false" ></DatePicker>
                            </div>
                        </div>
                        <div class="list" v-if="CertificateType == 5">
                            <div class="item" style="width:100%">
                                <span class="span1">签发地点:</span>
                                <Input placeholder="请输入签发地点" style="width: 512px" v-model="crew.idCardGrantOrg" clearable />
                            </div>
                        </div>
                        <div class="list" v-if="CertificateType != 5">
                            <div class="item" style="width:100%">
                                <span class="span1" v-if="CertificateType != 5" >身份证号:</span>
                                <Input v-model="crew.idCardNo" placeholder="请输入身份证号" style="width: 512px" clearable />
                            </div>
                        </div>
                        <div class="list" v-if="CertificateType == 1">
                            <div class="item" style="width:100%">
                                <span class="span1">发证机关:</span>
                                <Input v-model="crew.idCardGrantOrg" placeholder="请输入发证机关" style="width: 512px" clearable />
                            </div>
                        </div>
                        <div class="list" v-if="CertificateType == 1">
                            <div class="item" style="width:100%">
                                <span class="span1">住址</span>
                                <Input v-model="crew.address" placeholder="请输入住址" style="width: 512px" clearable />
                            </div>
                        </div>
                        <div class="list">
                            <div class="item" style="width:100%">
                                <span class="span1" v-if="CertificateType != 5" >身份证有效期:</span>
                                <span class="span1" v-if="CertificateType == 5" >有效期:</span>
                                <DatePicker
                                    type="date"
                                    placeholder="请选择证件开始有效期"
                                    style="width: 250px; margin-right:12px"
                                    v-model="crew.idCardStartDate"
                                    :clearable="false"
                                ></DatePicker>
                                <DatePicker
                                    type="date"
                                    placeholder="请选择证件结束有效期"
                                    style="width: 250px"
                                    v-model="crew.idCardEndDate"
                                    :clearable="false"
                                ></DatePicker>
                            </div>
                        </div>
                        <div class="list" v-if="CertificateType != 1">
                            <div class="item">
                                <span class="span1">工作证有效日期:</span>
                                <DatePicker
                                    type="date"
                                    placeholder="请选择工作证有效日期"
                                    style="width: 200px"
                                    :clearable="false"
                                    v-model="workCardEndDate"
                                ></DatePicker>
                            </div>
                            <div class="item">
                                <span class="span1">工作证编号:</span>
                                <Input placeholder="请输入工作证编号" style="width: 200px" v-model="workCardNo" clearable />
                            </div>
                        </div>
                    </div>
                    <div class="tags">
                        <div class="title">
                            <h2>项目信息</h2>
                        </div>
                        <div class="list">
                            <div class="item">
                                <span class="tip">*</span>
                                <span class="span1">班组:</span>
                                <Select v-model="groupId" placeholder="请选择班组" style="width:200px" filterable >
                                    <Option v-for="(item, index) in groupEmpList" :value="item.groupId" :key="index" >{{ item.groupName }}</Option>
                                </Select>
                            </div>
                            <div class="item">
                                <span class="span1">工号:</span>
                                <Input placeholder="请输入工号" style="width: 200px" v-model="empCode" clearable />
                            </div>
                        </div>
                        <div class="list">
                            <div class="item">
                                <span class="tip">*</span>
                                <span class="span1">工人类型:</span>
                                <el-radio-group v-model="crew.workRoleId" @change="getworkRole" >
                                    <el-radio :label="1">管理人员</el-radio>
                                    <el-radio :label="2">施工人员</el-radio>
                                </el-radio-group>
                            </div>
                            <div class="item">
                                <span class="tip">*</span>
                                <span class="span1">工种:</span>
                                <Select v-model="crew.workTypeId" style="width:200px" placeholder="请选择工种" @on-change="getworkType" filterable>
                                    <Option v-for="item in workTypelist" :value="item.workTypeId" :key="item.workTypeId" >{{ item.workTypeName }}</Option>
                                </Select>
                            </div>
                        </div>
                        <div class="list">
                            <div class="item" v-if="bzFlag">
                                <span class="tip">*</span>
                                <span class="span1">是否班组长:</span>
                                <el-radio-group v-model="crew.leaderFlag">
                                    <el-radio :label="0">否</el-radio>
                                    <el-radio :label="1">是</el-radio>
                                </el-radio-group>
                            </div>
                            <div class="item">
                                <span class="span1">入职时间:</span>
                                <DatePicker
                                    type="date"
                                    placeholder="请选择证件结束有效期"
                                    style="width: 200px"
                                    v-model="crew.enterTime"
                                    :clearable="false"
                                ></DatePicker>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="right">
                    <div class="tags" style="height:100%">
                        <div class="title">
                            <h2>其他信息</h2>
                        </div>
                        <div class="img_msg">
                            <div class="userPicture">
                                <div class="img">
                                    <!-- <img :src="crew.avatar"/> -->
                                    <el-image
                                        v-if='crew.avatar'
                                        style="width: 120px; height: 120px;border-radius:6px;"
                                        :src="crew.avatar"
                                        :preview-src-list="[crew.avatar]"
                                        :z-index="6000">
                                    </el-image>
                                    <div class="imgNull" v-else style="width: 120px; height: 120px;border-radius:6px;background: #E5E7EA;"></div>
                                    <p>用户图像</p>
                                </div>
                                <div class="button">
                                    <div class="update">
                                        <el-button type="primary" size="small">上传</el-button>
                                        <input id="upload_file2" type="file" @change="getavatar" accept=".jpg, .png"/>
                                    </div>
                                    <el-button  @click="getCream" type="primary" size="small" plain >拍摄</el-button >
                                </div>
                            </div>
                            <div class="tips"><span>*</span>请上传最小尺寸为128*128的图片,闸机刷脸需要</div>
                        </div>
                        <div class="card_msg">
                            <div class="item">
                                <el-upload
                                    class="upload-demo"
                                    drag
                                    :headers="headers"
                                    :action="$axios.defaults.baseURL + '/ms/api/emp/uploadImg'"
                                    :show-file-list="false"
                                    :on-success="firstImgSuccess"
                                    :before-upload="beforeAvatarUpload"
                                    name="file"
                                >
                                    <img :src="crew.idCardFront" v-if="crew.idCardFront != ''" />
                                    <div v-if="(CertificateType == 1 || CertificateType == 2 || CertificateType == 3) && crew.idCardFront == ''" class="el-upload__text" >
                                        身份证正面<br/>国徽面
                                    </div>
                                    <div v-if="CertificateType == 4 && crew.idCardFront == ''" class="el-upload__text" >
                                        身份识别证正面
                                    </div>
                                    <div v-if="CertificateType == 5 && crew.idCardFront == ''" class="el-upload__text" >
                                        逗留证照片
                                    </div>
                                </el-upload>
                            </div>
                            <div class="item" v-if="CertificateType != 5">
                                <el-upload
                                    class="upload-demo"
                                    drag
                                    :headers="headers"
                                    :action="$axios.defaults.baseURL + '/ms/api/emp/uploadImg'"
                                    :show-file-list="false"
                                    :on-success="secondImgSuccess"
                                    :before-upload="beforeAvatarUpload"
                                    name="file"
                                >
                                    <img :src="crew.idCardBack" v-if="crew.idCardBack != ''" />
                                    <div class="el-upload__text" v-if="(CertificateType == 1 || CertificateType == 2 || CertificateType == 3) && crew.idCardBack == ''" >
                                        身份证反面<br/>人像面
                                    </div>
                                    <div class="el-upload__text" v-if=" CertificateType == 4 && crew.idCardBack == ''" >
                                        身份识别证反面
                                    </div>
                                </el-upload>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div slot="footer">
                <el-button @click="cancel(1)" type="info" size="small" plain >取消</el-button>
                <el-button @click="submitAll(0)" type="primary" size="small" plain v-preventReClick="1500" >保存</el-button>
            </div>
        </Modal>

        <!-- 人员详情/编辑 -->
        <Modal v-model="detailsModal" :title="isAdd ? '人员详情' : '人员编辑'" :mask-closable="false" width="1100px;" >
            <div class="titles" style="margin-top:-10px">
                <Tabs v-model="tabActiveName">
                    <TabPane label="人员信息" name="1">
                        <div class="update " v-if="!isAdd">
                            <div class="left">
                                <div class="tags" style="margin-bottom:10px">
                                    <div class="title">
                                        <h2>基本信息</h2>
                                    </div>
                                    <div class="list">
                                        <div class="item" style="width:100%">
                                            <span class="tip">*</span>
                                            <span class="span1">证件类型:</span>
                                            <Select v-model="CertificateType" style="width:512px" @on-change="getCertificateType" >
                                                <Option v-for="item in CertificateTypeList" :value="item.id" :key="item.id" >{{ item.name }}</Option>
                                            </Select>
                                        </div>
                                    </div>
                                    <div class="list">
                                        <div class="item">
                                            <span class="tip">*</span>
                                            <span class="span1">姓名:</span>
                                            <Input v-model.trim="crew.name" placeholder="请输入姓名" :maxlength="length" show-word-limit style="width: 200px" clearable />
                                        </div>
                                        <div class="item">
                                            <span class="span1">电话:</span>
                                            <Input v-model="crew.phone" placeholder="请输入电话" style="width: 200px" clearable />
                                        </div>
                                    </div>
                                    <div class="list">
                                        <div class="item">
                                            <span class="tip">*</span>
                                            <span class="span1">性别:</span>
                                            <div class="radio">
                                                <el-radio-group v-model="crew.gender" >
                                                    <el-radio :label="1">男</el-radio>
                                                    <el-radio :label="2">女</el-radio>
                                                </el-radio-group>
                                            </div>
                                        </div>
                                        <div class="item">
                                            <span class="span1">学历:</span>
                                            <Select v-model="crew.education" style="width:200px" placeholder="请选择学历" >
                                                <Option v-for="item in educationList" :value="item.id" :key="item.id" >{{ item.name }}</Option>
                                            </Select>
                                        </div>
                                    </div>
                                    <div class="list">
                                        <div class="item" v-if="CertificateType == 1" >
                                            <span class="span1">民族:</span>
                                            <Select v-model="crew.nation" style="width:200px" placeholder="请选择民族" @on-change="getethnicType" >
                                                <Option v-for="(item, index) in ethnicList" :value="item" :key="index" >{{ item }}</Option>
                                            </Select>
                                        </div>
                                        <div class="item" v-if="CertificateType != 1 && CertificateType != 5" >
                                            <span class="span1">出生日期:</span>
                                            <DatePicker
                                                type="date"
                                                placeholder="请选择出生日期"
                                                style="width: 200px"
                                                v-model="crew.birthday"
                                                :clearable="false"
                                            ></DatePicker>
                                        </div>
                                        <div class="item" v-if="CertificateType == 5" >
                                            <span class="span1" v-if="CertificateType == 5" >证件号码:</span>
                                            <Input v-model="crew.idCardNo" placeholder="请输入证件号码" style="width: 200px" clearable />
                                        </div>
                                        <div class="item">
                                            <span class="span1">学位:</span>
                                            <Select v-model="crew.degree" style="width:200px" placeholder="请选择学位" >
                                                <Option v-for="item in degreeList" :value="item.id" :key="item.id" >{{ item.name }}</Option>
                                            </Select>
                                        </div>
                                    </div>
                                    <div class="list" v-if="CertificateType == 1" >
                                        <div class="item" style="width:100%">
                                            <span class="span1">出生日期:</span>
                                            <DatePicker
                                                type="date"
                                                placeholder="请选择出生日期"
                                                style="width: 512px"
                                                v-model="crew.birthday"
                                                :clearable="false"
                                            ></DatePicker>
                                        </div>
                                    </div>
                                    <div class="list" v-if="CertificateType == 5" >
                                        <div class="item" style="width:100%">
                                            <span class="span1">签发地点:</span>
                                            <Input placeholder="请输入签发地点" style="width: 512px" v-model="crew.idCardGrantOrg" clearable />
                                        </div>
                                    </div>
                                    <div class="list" v-if="CertificateType != 5" >
                                        <div class="item" style="width:100%">
                                            <span class="span1" v-if="CertificateType != 5" >身份证号:</span>
                                            <Input v-model="crew.idCardNo" placeholder="请输入身份证号" style="width: 512px" clearable />
                                        </div>
                                    </div>
                                    <div class="list" v-if="CertificateType == 1" >
                                        <div class="item" style="width:100%">
                                            <span class="span1">发证机关:</span>
                                            <Input v-model="crew.idCardGrantOrg" placeholder="请输入发证机关" style="width: 512px" clearable />
                                        </div>
                                    </div>
                                    <div class="list" v-if="CertificateType == 1" >
                                        <div class="item" style="width:100%">
                                            <span class="span1">住址</span>
                                            <Input v-model="crew.address" placeholder="请输入住址" style="width: 512px" clearable />
                                        </div>
                                    </div>
                                    <div class="list">
                                        <div class="item" style="width:100%">
                                            <span class="span1" v-if="CertificateType != 5" >身份证有效期:</span>
                                            <span class="span1" v-if="CertificateType == 5" >有效期:</span>
                                            <DatePicker
                                                type="date"
                                                placeholder="请选择证件开始有效期"
                                                style="width: 250px; margin-right:12px"
                                                @on-change="idCardStartDateChange"
                                                v-model="crew.idCardStartDate"
                                                :clearable="false"
                                            ></DatePicker>
                                            <DatePicker
                                                type="date"
                                                placeholder="请选择证件结束有效期"
                                                style="width: 250px"
                                                @on-change="idCardEndDateChange"
                                                v-model="crew.idCardEndDate"
                                                :clearable="false"
                                            ></DatePicker>
                                        </div>
                                    </div>
                                    <div class="list" v-if="CertificateType != 1">
                                        <div class="item">
                                            <span class="span1" >工作证有效日期:</span>
                                            <DatePicker
                                                type="date"
                                                placeholder="请选择工作证有效日期"
                                                style="width: 200px"
                                                :clearable="false"
                                                v-model="workCardEndDate"
                                            ></DatePicker>
                                        </div>
                                        <div class="item">
                                            <span class="span1" >工作证编号:</span>
                                            <Input placeholder="请输入工作证编号" style="width: 200px" v-model="workCardNo" clearable />
                                        </div>
                                    </div>
                                </div>
                                <div class="tags">
                                    <div class="title">
                                        <h2>项目信息</h2>
                                    </div>
                                    <div class="list">
                                        <div class="item">
                                            <span class="tip">*</span>
                                            <span class="span1">班组:</span>
                                            <Select v-model="groupId" placeholder="请选择班组" style="width:200px" filterable :transfer="true" >
                                                <Option v-for="(item, index) in groupEmpList" :value="item.groupId" :key="index" >{{ item.groupName }}</Option>
                                            </Select>
                                        </div>
                                        <div class="item">
                                            <span class="span1">工号:</span>
                                            <Input placeholder="请输入工号" style="width: 200px" v-model="empCode" clearable />
                                        </div>
                                    </div>
                                    <div class="list">
                                        <div class="item">
                                            <span class="tip">*</span>
                                            <span class="span1">工人类型:</span>
                                            <el-radio-group v-model="crew.workRoleId" @change="getworkRole" >
                                                <el-radio :label="1" >管理人员</el-radio>
                                                <el-radio :label="2" >施工人员</el-radio>
                                            </el-radio-group>
                                        </div>
                                        <div class="item">
                                            <span class="tip">*</span>
                                            <span class="span1">工种:</span>
                                            <Select
                                                v-model="crew.workTypeId"
                                                style="width:200px"
                                                placeholder="请选择工种"
                                                @on-change="getworkType"
                                                filterable
                                                :transfer="true"
                                            >
                                                <Option
                                                    v-for="item in workTypelist"
                                                    :value="item.workTypeId"
                                                    :key="item.workTypeId"
                                                    >{{ item.workTypeName }}</Option>
                                            </Select>
                                        </div>
                                    </div>
                                    <div class="list">
                                        <div class="item" v-if="bzFlag">
                                            <span class="span1" >是否班组长:</span>
                                            <el-radio-group v-model="crew.leaderFlag">
                                                <el-radio :label="0" >否</el-radio>
                                                <el-radio :label="1" >是</el-radio>
                                            </el-radio-group>
                                        </div>
                                        <div class="item" v-if="detailsObj.postState == 1" >
                                            <span class="span1" >安全帽编码:</span>
                                            <Input v-model="crew.sn" disabled style="width: 200px" clearable />
                                        </div>
                                    </div>
                                    <div class="list" v-if="detailsObj.postState == 1" >
                                        <div class="item">
                                            <span class="span1">入职时间:</span>
                                            <DatePicker
                                                type="date"
                                                placeholder="请选择证件结束有效期"
                                                style="width: 200px"
                                                disabled
                                                v-model="crew.enterTime"
                                                :clearable="false"
                                            ></DatePicker>
                                        </div>
                                        <div class="item">
                                            <span class="span1">离职时间:</span>
                                            <Input v-model="crew.outerTime" disabled style="width: 200px" clearable />
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="right" style="height:700px">
                                <div class="tags" style="height:100%">
                                    <div class="title">
                                        <h2>其他信息</h2>
                                    </div>
                                    <div class="img_msg">
                                        <div class="userPicture">
                                            <div class="img">
                                                <!-- <img :src="crew.avatar"/> -->
                                                <el-image
                                                    style="width: 120px; height: 120px;border-radius:6px;"
                                                    :src="crew.avatar"
                                                    :preview-src-list="[crew.avatar]"
                                                    :z-index="6000">
                                                </el-image>
                                                <p>用户图像</p>
                                            </div>
                                            <div class="button">
                                                <div class="update">
                                                    <el-button type="primary" size="small">上传</el-button>
                                                    <input id="upload_file3" type="file" @change="getavatar" accept=".jpg, .png"/>
                                                </div>
                                                <el-button  @click="getCream" type="primary" size="small" plain >拍摄</el-button >
                                            </div>
                                        </div>
                                        <div class="tips"><span>*</span>请上传最小尺寸为128*128的图片,闸机刷脸需要</div>
                                    </div>
                                    <div class="card_msg">
                                        <div class="item">
                                            <el-upload
                                                class="upload-demo"
                                                drag
                                                :headers="headers"
                                                :action="$axios.defaults.baseURL + '/ms/api/emp/uploadImg'"
                                                :show-file-list="false"
                                                :on-success="firstImgSuccess"
                                                :before-upload="beforeAvatarUpload"
                                                name="file"
                                            >
                                                <img :src="crew.idCardFront" v-if="crew.idCardFront != ''" style="height: 100%" />
                                                <div v-if="(CertificateType == 1 || CertificateType == 2 || CertificateType == 3) && crew.idCardFront == ''" class="el-upload__text" >
                                                    身份证正面<br/>国徽面
                                                </div>
                                                <div v-if="CertificateType == 4 && crew.idCardFront == ''" class="el-upload__text" >
                                                    身份识别证正面
                                                </div>
                                                <div v-if="CertificateType == 5 && crew.idCardFront == ''" class="el-upload__text" >
                                                    逗留证照片
                                                </div>
                                            </el-upload>
                                        </div>
                                        <div class="item" v-if="CertificateType != 5" >
                                            <el-upload
                                                class="upload-demo"
                                                drag
                                                :headers="headers"
                                                :action="$axios.defaults.baseURL + '/ms/api/emp/uploadImg'"
                                                :show-file-list="false"
                                                :on-success="secondImgSuccess"
                                                :before-upload="beforeAvatarUpload"
                                                name="file"
                                            >
                                                <img style="height: 100%" :src="crew.idCardBack" v-if="crew.idCardBack != ''" />
                                                <div class="el-upload__text" v-if="(CertificateType == 1 || CertificateType == 2 || CertificateType == 3) && crew.idCardBack == ''" >
                                                    身份证反面<br/>人像面
                                                </div>
                                                <div class="el-upload__text" v-if="CertificateType == 4 && crew.idCardBack == ''" >
                                                    身份识别证反面
                                                </div>
                                            </el-upload>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div v-if="isAdd" class="update">
                            <div class="left">
                                <div class="tags" style="margin-bottom:10px">
                                    <div class="title">
                                        <h2>基本信息</h2>
                                        <!-- <el-button @click="edit_btn" type="primary" size="small" plain style="margin-left:20px" :disabled="!btnList.includes('emp/list/edit')">编辑</el-button> -->
                                        <i class="el-icon-edit edit" style="margin-left:10px;font-size:16px;cursor: pointer" @click="edit_btn" v-if="btnList.includes('emp/list/edit')"></i>
                                    </div>
                                    <div class="list">
                                        <div class="item">
                                            <span class="span1">证件类别:</span>
                                            <span class="spanbox" v-if="detailsObj.cardType == 1" >居民身份证</span>
                                            <span class="spanbox" v-if="detailsObj.cardType == 2" >澳门永久居民证</span>
                                            <span class="spanbox" v-if="detailsObj.cardType == 3" >澳门非永久居民证</span>
                                            <span class="spanbox" v-if="detailsObj.cardType == 4" >澳门外地雇员身份识别证</span>
                                            <span class="spanbox" v-if="detailsObj.cardType == 5" >澳门特别逗留证</span>
                                        </div>
                                        <div class="item">
                                            <span class="span1">联系电话:</span>
                                            <span class="spanbox">{{ detailsObj.phone || "-" }}</span>
                                        </div>
                                    </div>
                                    <div class="list">
                                        <div class="item">
                                            <span class="span1">姓名:</span>
                                            <span class="spanbox">{{ detailsObj.empName || "-" }}</span>
                                        </div>
                                        <div class="item">
                                            <span class="span1">学历:</span>
                                            <span class="spanbox" v-if="detailsObj.education == 1" >博士后</span>
                                            <span class="spanbox" v-if="detailsObj.education == 2" >博士</span>
                                            <span class="spanbox" v-if="detailsObj.education == 3" >研究生</span>
                                            <span class="spanbox" v-if="detailsObj.education == 4" >硕士</span>
                                            <span class="spanbox" v-if="detailsObj.education == 5" >本科</span>
                                            <span class="spanbox" v-if="detailsObj.education == 6" >大专</span>
                                            <span class="spanbox" v-if="detailsObj.education == 7" >中专</span>
                                            <span class="spanbox" v-if="detailsObj.education == 8" >高中</span>
                                            <span class="spanbox" v-if="detailsObj.education == 9" >专科及以下学历</span>
                                            <span class="spanbox" v-if="detailsObj.education == 10" >其他</span>
                                            <span class="spanbox" v-if="!detailsObj.education" >-</span>
                                        </div>
                                    </div>
                                    <div class="list">
                                        <div class="item">
                                            <span class="span1">性别:</span>
                                            <span v-if="detailsObj.gender == 1" >男</span>
                                            <span v-if="detailsObj.gender == 2" >女</span>
                                        </div>
                                        <div class="item">
                                            <span class="span1">学位:</span>
                                            <span class="spanbox" v-if="detailsObj.degree == 1" >博士后学位</span>
                                            <span class="spanbox" v-if="detailsObj.degree == 2" >博士学位</span>
                                            <span class="spanbox" v-if="detailsObj.degree == 3" >硕士学位</span>
                                            <span class="spanbox" v-if="detailsObj.degree == 4" >学士学位</span>
                                            <span class="spanbox" v-if="detailsObj.degree == 5" >无学位</span>
                                            <span class="spanbox" v-if="detailsObj.degree == 6" >其他</span>
                                            <span class="spanbox" v-if="!detailsObj.degree" >-</span>
                                        </div>
                                    </div>
                                    <div class="list" v-if="detailsObj.cardType == 1" >
                                        <div class="item" style="width:100%">
                                            <span class="span1">民族:</span>
                                            <span style="width:512px">{{ detailsObj.nation || "-" }}</span>
                                        </div>
                                    </div>
                                    <div class="list">
                                        <div class="item">
                                            <span class="span1">年龄:</span>
                                            <span class="spanbox">{{ age || "-" }}</span>
                                        </div>
                                    </div>
                                    <div class="list" v-if="detailsObj.cardType == 5" >
                                        <div class="item" style="width:100%">
                                            <span class="span1">签发地点:</span>
                                            <span style="width:512px">{{ detailsObj.idCardGrantOrg || "-" }}</span>
                                        </div>
                                    </div>
                                    <div class="list">
                                        <div class="item" style="width:100%">
                                            <span class="span1">身份证号:</span>
                                            <span style="width:512px">{{ detailsObj.idCardNo || "-" }}</span>
                                        </div>
                                    </div>
                                    <div class="list" v-if="detailsObj.cardType == 1" >
                                        <div class="item" style="width:100%">
                                            <span class="span1">住址:</span>
                                            <span style="width:512px">{{ detailsObj.address || "-" }}</span>
                                        </div>
                                    </div>
                                    <div class="list">
                                        <div class="item" style="width:100%;">
                                            <span class="span1">有效期:</span>
                                            <span style="width:512px" >{{ detailsObj.idCardStartDate }}-{{ detailsObj.idCardEndDate }}</span>
                                        </div>
                                    </div>
                                    <div class="list" v-if="detailsObj.cardType == 1" >
                                        <div class="item">
                                            <span class="span1">发证机关:</span>
                                            <span class="spanbox">{{ detailsObj.idCardGrantOrg || "-" }}</span>
                                        </div>
                                    </div>
                                    <div class="list" v-if="detailsObj.cardType != 1" >
                                        <div class="item">
                                            <span class="span1" >工作证有效期:</span>
                                            <span class="spanbox">{{ detailsObj.workCardEndDate || "-" }}</span>
                                        </div>
                                        <div class="item">
                                            <span class="span1" >工作证编号:</span>
                                            <span class="spanbox">{{ detailsObj.workCardNo || "-" }}</span>
                                        </div>
                                    </div>
                                </div>
                                <div class="tags">
                                    <div class="title">
                                        <h2>项目信息</h2>
                                    </div>
                                    <div class="list">
                                        <div class="item">
                                            <span class="span1">班组:</span>
                                            <span class="spanbox">{{ detailsObj.groupName }}</span>
                                        </div>
                                        <div class="item">
                                            <span class="span1">工号:</span>
                                            <el-tooltip placement="top" v-if="detailsObj.empCode&&detailsObj.empCode.length>14">
                                                <div slot="content">
                                                    <span class="spanbox">{{ detailsObj.empCode}}</span>
                                                </div>
                                                <span class="spanbox">{{ detailsObj.empCode | ellipsis }}</span>
                                            </el-tooltip>
                                            <span v-else class="spanbox">{{ detailsObj.empCode || "-" }}</span>
                                        </div>
                                    </div>
                                    <div class="list">
                                        <div class="item">
                                            <span class="span1">工人类型:</span>
                                            <span class="spanbox">{{ detailsObj.workRoleName }}</span>
                                        </div>
                                        <div class="item">
                                            <span class="span1" >岗位/工种:</span>
                                            <span class="spanbox">{{ detailsObj.workTypeName }}</span>
                                        </div>
                                    </div>
                                    <div class="list">
                                        <div class="item" v-if="detailsObj.workRoleId == 2" >
                                            <span class="span1" style="white-space: nowrap;width: 75px;" >是否班组长:</span>
                                            <span class="spanbox" v-if="detailsObj.leaderFlag == 1" >是</span>
                                            <span class="spanbox" v-if=" detailsObj.leaderFlag == 0 " >否</span>
                                        </div>
                                        <div class="item" v-if="detailsObj.postState == 1" >
                                            <span class="span1" style="white-space: nowrap;width: 75px;" >安全帽编码:</span>
                                            <span class="spanbox">{{ detailsObj.sn || "-" }}</span>
                                        </div>
                                    </div>
                                    <div class="list">
                                        <div class="item">
                                            <span class="span1">入职时间:</span>
                                            <span class="spanbox">{{ detailsObj.enterTime || "-" }}</span>
                                        </div>
                                        <div class="item" v-if="detailsObj.postState == 2" >
                                            <span class="span1">离职时间:</span>
                                            <span class="spanbox">{{ detailsObj.outerTime || "-" }}</span>
                                        </div>
                                    </div>
                                    <!-- <div class="list">
                                        <div class="item">
                                            <span class="span1 spanActive" >是否通过入场三级教育:</span>
                                            <span class="spanbox" v-if="detailsObj.passFlag == 1" >是</span>
                                            <span class="spanbox" v-if="detailsObj.passFlag == 0" >否</span>
                                        </div>
                                    </div> -->
                                    <div class="list">
                                        <div class="item">
                                            <span class="span1">所属单位:</span>
                                            <span class="spanbox">{{ detailsObj.corpName }}</span>
                                        </div>

                                    </div>
                                </div>
                            </div>
                            <div class="right" style="margin-top:0px;height:740px" >
                                <div class="tags" style="height:100%">
                                    <div class="userInfoPicture">
                                        <div class="userImage">
                                            <el-image
                                                style="width: 120px; height: 120px;border-radius:6px;"
                                                :src="detailsObj.avatar == '' ? crew.src : detailsObj.avatar"
                                                :preview-src-list="[detailsObj.avatar == '' ? crew.src : detailsObj.avatar]"
                                                :z-index="6000">
                                            </el-image>
                                        </div>
                                        <!-- <div class="userCode">
                                            <img :src="qrCodeSrc"/>
                                            <el-button
                                                @click="downloadQRCode"
                                                type="primary"
                                                size="small"
                                                plain
                                                >下载二维码</el-button>
                                        </div> -->
                                    </div>
                                    <div class="card_msg">
                                        <div class="item">
                                            <div class="u_cord" v-if="detailsObj.idCardFront" >
                                                <img :src="detailsObj.idCardFront" @click.stop="previewImgShow(detailsObj.idCardFront)"/>
                                            </div>
                                        </div>
                                        <div class="item" v-if="CertificateType != 5 && detailsObj.idCardBack">
                                            <div class="u_cord">
                                                <img :src="detailsObj.idCardBack" @click.stop="previewImgShow(detailsObj.idCardBack)" />
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </TabPane>
                    <TabPane label="合同信息" v-if="btnList.includes('emp/contract/btn')" name="2">
                        <el-button @click="updateContract(0)" type="primary" size="small" plain >添加合同信息</el-button>
                        <el-table :data="contractList" style="width: 100%;margin-top:20px" height="500" border :stripe="true">
                            <el-table-column prop="state" label="合同状态">
                                <template slot-scope="scope">
                                    <span v-if="scope.row.state == 0" size="small" >未签订</span>
                                    <span v-if="scope.row.state == 1" size="small" >已签订</span>
                                </template>
                            </el-table-column>
                            <el-table-column prop="contractNo" label="合同编号" ></el-table-column>
                            <el-table-column prop="certCode" label="合同期限">
                                <template slot-scope="scope">
                                    <span v-if="scope.row.contactType == 0" size="small" >固定期限</span>
                                    <span v-if="scope.row.contactType == 1" size="small" >固定工作量</span>
                                </template>
                            </el-table-column>
                            <el-table-column label="有效期日期" width="200px">
                                <template slot-scope="scope">
                                    <span>{{ scope.row.startDate }}至{{ scope.row.endDate }}</span>
                                </template>
                            </el-table-column>
                            <el-table-column label="工资核定方式">
                                <template slot-scope="scope">
                                    <span v-if="scope.row.payType == 1" size="small" >按小时</span>
                                    <span v-if="scope.row.payType == 2" size="small" >按天</span>
                                    <span v-if="scope.row.payType == 3" size="small" >按月</span>
                                </template>
                            </el-table-column>
                            <el-table-column prop="salary" label="单价" ></el-table-column>
                            <el-table-column prop="fileNo" label="附件" >
                                <template slot-scope="scope">
                                    <el-link v-for="(src, index) in scope.row.fileAttachList" :key="index" target="_blank" :href="src.url" type="primary" >
                                        {{index!=0?'、':''}}查看
                                    </el-link>
                                </template>
                                <!-- <template v-if="scope.row.fileAttachList && scope.row.fileAttachList.length > 0">
                                    <viewer :images="scope.row.fileAttachList">
                                        <img :style="{width: '45px',height: '45px','margin-right': '5px',cursor: 'pointer'}"
                                            v-for="(src, index) in scope.row.fileAttachList" :src="src.url" :key="index"/>
                                    </viewer>
                                </template>
                                <span v-else>—</span> -->
                            </el-table-column>
                            <el-table-column label="操作" align="center" width="150px" >
                                <template slot-scope="scope">
                                    <el-button @click.native.prevent="updateContract(1, scope.$index, contractList)" type="text" size="small" >编辑</el-button>
                                    <el-button style="color:red" @click.native.prevent="removeContractRow(scope.$index, contractList)" type="text" size="small" >删除</el-button>
                                </template>
                            </el-table-column>
                        </el-table>
                    </TabPane>
                    <TabPane label="资格证书" v-if="btnList.includes('emp/cert/btn')" name="3" >
                        <el-button @click="updateCert(0)" type="primary" size="small" plain >添加资格证书</el-button>
                        <el-table :data="cretList" style="width: 100%;margin-top:20px" height="500" border :stripe="true">
                            <el-table-column prop="certName" label="证书名称" ></el-table-column>
                            <el-table-column prop="certCode" label="证书编号" ></el-table-column>
                            <el-table-column prop="certStartDate" label="发证日期" ></el-table-column>
                            <el-table-column prop="certExpireDate" label="证件有效期" ></el-table-column>
                            <el-table-column prop="certGrantOrg" label="发证机关" ></el-table-column>
                            <el-table-column prop="fileAttachList" label="附件图片" width="200px" >
                                <template slot-scope="scope">
                                    <template v-if="scope.row.imgAll && scope.row.imgAll.length > 0" >
                                        <viewer :images="scope.row.imgAll">
                                            <img :style="{width: '45px',height: '45px','margin-right': '5px',cursor: 'pointer'}" v-for="(src, index) in scope.row.imgAll" :src="src" :key="index"/>
                                        </viewer>
                                    </template>
                                    <span v-else>—</span>
                                </template>
                            </el-table-column>
                            <el-table-column label="操作" align="center" width="150px" >
                                <template slot-scope="scope">
                                    <el-button @click.native.prevent="updateCert(1, scope.$index, cretList)" type="text" size="small" >编辑</el-button>
                                    <el-button style="color:red" @click.native.prevent="removeCertRow(scope.$index, cretList)" type="text" size="small" >删除</el-button>
                                </template>
                            </el-table-column>
                        </el-table>
                    </TabPane>
                    <TabPane label="银行账号" v-if="btnList.includes('emp/bank/btn')" name="4" >
                        <el-button @click="updateBank(0)" type="primary" size="small" plain >添加银行卡</el-button>
                        <el-table :data="bankList" style="width: 100%;margin-top:20px" height="500" border :stripe="true">
                            <el-table-column prop="bankType" label="银行名称"></el-table-column>
                            <el-table-column prop="bankName" label="开户行"></el-table-column>
                            <el-table-column prop="bankNumber" label="银行卡号"></el-table-column>
                            <el-table-column label="状态">
                                <template slot-scope="scope">
                                    <el-switch v-model="scope.row.enableFlag" active-color="#13ce66" inactive-color="#999" @change="getFlag(scope.$index, bankList)"></el-switch>
                                </template>
                            </el-table-column>
                            <el-table-column label="操作" align="center" width="150px">
                                <template slot-scope="scope">
                                    <el-button @click.native.prevent="updateBank(1,scope.$index,bankList)" type="text" size="small" >编辑</el-button>
                                    <el-button style="color:red" @click.native.prevent="removeBank(scope.$index, bankList)" type="text" size="small" >删除</el-button>
                                </template>
                            </el-table-column>
                        </el-table>
                    </TabPane>
                    <TabPane label="工资记录" v-if="btnList.includes('emp/payroll/btn')" name="5">
                        <el-table :data="payrollList" style="width: 100%;margin-top:20px" height="500" border :stripe="true">
                            <el-table-column prop="date" label="发放日期"></el-table-column>
                            <el-table-column prop="bankNumber" label="银行卡号"></el-table-column>
                            <el-table-column prop="salaryTotal" label="工资总额"></el-table-column>
                            <el-table-column prop="salaryShould" label="应发工资"></el-table-column>
                            <el-table-column prop="salaryReal" label="实发工资"></el-table-column>
                            <el-table-column prop="remark" label="备注"></el-table-column>
                            <el-table-column prop="imgUrlList" label="工资图片" width="200px">
                                <template slot-scope="scope">
                                    <template v-if="scope.row.imgUrlList && scope.row.imgUrlList.length > 0">
                                        <viewer :images="scope.row.imgUrlList">
                                            <img :style="{width: '45px',height: '45px','margin-right': '5px',cursor: 'pointer'}" v-for="(src, index) in scope.row.imgUrlList" :src="src" :key="index" />
                                        </viewer>
                                    </template>
                                    <span v-else>—</span>
                                </template>
                            </el-table-column>
                        </el-table>
                    </TabPane>
                    <TabPane label="奖惩记录" v-if="btnList.includes('emp/reward/btn')" name="6">
                        <el-table :data="rewardList" style="width: 100%" height="500" border :stripe="true">
                            <el-table-column prop="date" label="发生时间"></el-table-column>
                            <el-table-column prop="type" label="奖惩类型">
                                <template slot-scope="scope">
                                    <el-tag type="success" v-if="scope.row.type == 1" size="small" >奖励</el-tag>
                                    <el-tag type="info" v-if="scope.row.type == 2" size="small" >惩罚</el-tag>
                                </template>
                            </el-table-column>
                            <el-table-column prop="item" label="奖惩记录分类">
                                <template slot-scope="scope">
                                    <el-tag type="success" v-if="scope.row.item == 1" size="small" >火电气</el-tag>
                                    <el-tag type="success" v-if="scope.row.item == 2" size="small" >气瓶</el-tag>
                                    <el-tag type="success" v-if="scope.row.item == 3" size="small" >特种作业证</el-tag>
                                    <el-tag type="success" v-if="scope.row.item == 4" size="small" >悬空作业</el-tag>
                                    <el-tag type="success" v-if="scope.row.item == 5" size="small" >高处作业</el-tag>
                                    <el-tag type="success" v-if="scope.row.item == 6" size="small" >翻斗车</el-tag>
                                    <el-tag type="success" v-if="scope.row.item == 7" size="small" >安全帽</el-tag>
                                    <el-tag type="success" v-if="scope.row.item == 8" size="small" >安全带</el-tag>
                                    <el-tag type="success" v-if="scope.row.item == 9" size="small" >国家级</el-tag>
                                    <el-tag type="success" v-if="scope.row.item == 10" size="small" >省级</el-tag>
                                    <el-tag type="success" v-if="scope.row.item == 11" size="small" >市级</el-tag>
                                </template>
                            </el-table-column>
                            <el-table-column prop="description" label="描述"></el-table-column>
                        </el-table>
                    </TabPane>
                    <TabPane label="培训记录" v-if="btnList.includes('emp/train/btn')" name="7">
                        <el-table :data="trainList" style="width: 100%" height="500" border :stripe="true">
                            <el-table-column prop="name" label="培训名称"></el-table-column>
                            <el-table-column prop="trainTypeName" label="培训类型"></el-table-column>
                            <el-table-column prop="date" label="培训日期"></el-table-column>
                            <el-table-column prop="address" label="培训地点" width="180px">
                                <template slot-scope="scope">
                                    <Tooltip transfer :content="scope.row.address" placement="top-start" max-width="200">
                                        <div class="p" style="width:180px;overflow: hidden;text-overflow:ellipsis;white-space:nowrap;cursor: pointer;">
                                            {{ scope.row.address }}
                                        </div>
                                    </Tooltip>
                                </template>
                            </el-table-column>
                            <el-table-column prop="score" label="培训成绩"></el-table-column>
                            <el-table-column prop="passFlag" label="是否合格">
                                <template slot-scope="scope">
                                    <p>{{scope.row.passFlag == 1 ? "合格" : "不合格"}}</p>
                                </template>
                            </el-table-column>
                            <el-table-column prop="imgUrlList" label="成绩图片" width="200px">
                                <template slot-scope="scope">
                                    <template v-if="scope.row.imgUrlList && scope.row.imgUrlList.length > 0">
                                        <viewer :images="scope.row.imgUrlList">
                                            <img :style="{width: '45px',height: '45px','margin-right': '5px',cursor: 'pointer'}" v-for="(src, index) in scope.row.imgUrlList" :src="src" :key="index"/>
                                        </viewer>
                                    </template>
                                    <span v-else>—</span>
                                </template>
                            </el-table-column>
                        </el-table>
                        <div class="clearfix" v-show="trainList.length > 0" style="margin: 20px auto; display: flex;justify-content: center;">
                            <div class="float-right">
                                <Page
                                    v-if="totalCount_train"
                                    :current.sync="current_train"
                                    :total="totalCount_train"
                                    :page-size="pageSize_train"
                                    show-elevator
                                    show-total
                                    @on-change="pageChange_train"
                                ></Page>
                            </div>
                        </div>
                    </TabPane>
                    <TabPane label="安全交底" v-if="btnList.includes('emp/confess/btn')" name="8">
                        <el-button @click="setConfess(1)" type="primary" size="small" plain style="margin-bottom: 10px" v-if="btnList.includes('emp/confess/add')">
                            <span>+ 交底记录</span>
                        </el-button>
                        <div class="table">
                            <el-table :data="confessList" style="width: 100%" height="500" border :stripe="true">
                                <el-table-column prop="projectName" label="工程名称" :show-overflow-tooltip="true">
                                    <template slot-scope="scope">
                                        <span style="cursor: pointer">{{scope.row.projectName ? scope.row.projectName : "—"}}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column prop="date" label="交底日期" :show-overflow-tooltip="true">
                                    <template slot-scope="scope">
                                        <span style="cursor: pointer">{{scope.row.date ? scope.row.date : "—"}}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column prop="corpName" label="施工单位" :show-overflow-tooltip="true">
                                    <template slot-scope="scope">
                                        <span style="cursor: pointer">{{scope.row.corpName ? scope.row.corpName : "—"}}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column prop="confidantName" label="交底人">
                                    <template slot-scope="scope">{{scope.row.confidantName ? scope.row.confidantName : "—"}}</template>
                                </el-table-column>
                                <el-table-column prop="beConfidantName" label="被交底人">
                                    <template slot-scope="scope">{{scope.row.beConfidantName ? scope.row.beConfidantName : "—"}}</template>
                                </el-table-column>
                                <el-table-column prop="imgUrlList" label="文件" width="200px">
                                    <template slot-scope="scope">
                                        <template v-if="scope.row.imgUrlList && scope.row.imgUrlList.length > 0">
                                            <viewer :images="scope.row.imgUrlList">
                                                <!-- <img :style="{width: '45px',height: '45px','margin-right': '5px',cursor: 'pointer'}" v-for="(src, index) in scope.row.imgUrlList" :src="src" :key="index"/> -->
                                                <el-link v-for="(src, index) in scope.row.imgUrlList" :key="index" target="_blank" :href="src" type="primary" >{{index!=0?'、':''}}查看</el-link>
                                            </viewer>
                                        </template>
                                        <span v-else>—</span>
                                    </template>
                                </el-table-column>
                                <!-- <el-table-column prop="signImgUrl" label="签名图片">
                                    <template slot-scope="scope">
                                        <template v-if="scope.row.signImgUrl">
                                            <viewer :images="[scope.row.signImgUrl]">
                                                <img :style="{width: '45px',height: '45px','margin-right': '5px',cursor: 'pointer'}" :src="scope.row.signImgUrl"/>
                                            </viewer>
                                        </template>
                                        <template v-else>
                                            <span>—</span>
                                        </template>
                                    </template>
                                </el-table-column> -->
                                <el-table-column
                                    label="操作"
                                    width="200px"
                                    v-if="btnList.includes('emp/confess/edit') || btnList.includes('emp/confess/del') || btnList.includes('emp/confess/complete')">
                                    <template slot-scope="scope">
                                        <el-button v-if="btnList.includes('emp/confess/edit')" @click.native.prevent="setConfess(2, scope.row)" type="text" size="small" >编辑</el-button>
                                        <!-- <el-button v-if="btnList.includes('emp/confess/complete')" @click.native.prevent="uploadFn(scope.row.confessId)" type="text" size="small" >电子签名</el-button> -->
                                        <el-button
                                            v-if="btnList.includes('emp/confess/del')"
                                            style="color:red"
                                            @click.native.prevent="removeRow(scope.row.confessId,4)"
                                            type="text"
                                            size="small"
                                            >删除</el-button
                                        >
                                    </template>
                                </el-table-column>
                            </el-table>
                        </div>
                        <div class="clearfix" v-show="confessList.length > 0" style="margin: 20px auto; display: flex;justify-content: center;">
                            <div class="float-right">
                                <Page
                                    v-if="totalCount_confess"
                                    :current.sync="current_confess"
                                    :total="totalCount_confess"
                                    :page-size="pageSize_confess"
                                    show-elevator
                                    show-total
                                    @on-change="pageChange_confess"
                                ></Page>
                            </div>
                        </div>
                    </TabPane>
                    <TabPane label="社保及体检信息" v-if="btnList.includes('emp/health/btn')" name="9">
                        <Tabs v-model="healthActive" @on-click="setHealthTabClick" v-if="tabActiveName==='9'">
                            <TabPane label="社保证明" name="healthCode"></TabPane>
                            <TabPane label="体检报告" name="journeyCard"></TabPane>
                            <!-- <TabPane label="核酸记录" name="testRecord"></TabPane> -->
                            <!-- <TabPane label="疫苗接种" name="vaccination"></TabPane> -->
                        </Tabs>
                        <el-button
                            @click="setHealth(1)"
                            type="primary"
                            size="small"
                            plain
                            style="margin-bottom: 10px"
                            v-if="btnList.includes('emp/health/report/add')"
                        >
                            <span v-if="healthActive == 'healthCode'">+ 上传社保证明</span>
                            <span v-if="healthActive == 'journeyCard'">+ 上传体检报告</span>
                            <!-- <span v-if="healthActive == 'testRecord'">+ 核酸记录</span> -->
                            <!-- <span v-if="healthActive == 'vaccination'">+ 接种记录</span> -->
                        </el-button>
                        <div class="table" v-show="healthActive == 'healthCode'">
                            <el-table :data="healthList" style="width: 100%" height="500" border :stripe="true">
                                <el-table-column prop="date" label="更新日期"></el-table-column>
                                <!-- <el-table-column prop="codeState" label="健康状态">
                                    <template slot-scope="scope">
                                        <span v-if="scope.row.codeState == 'green'">绿码</span>
                                        <span v-if="scope.row.codeState == 'red'">红码</span>
                                        <span v-if="scope.row.codeState == 'yellow'">黄码</span>
                                        <span v-if="scope.row.codeState == ''">—</span>
                                    </template>
                                </el-table-column> -->
                                <el-table-column prop="imgList" label="文件">
                                    <template slot-scope="scope">
                                        <template v-if="scope.row.imgList && scope.row.imgList.length > 0">
                                            <viewer :images="scope.row.imgList">
                                                <!-- <img :style="{width: '45px',height: '45px','margin-right': '5px',cursor: 'pointer'}" v-for="(src, index) in scope.row.imgList" :src="src" :key="index"/> -->
                                                <el-link v-for="(src, index) in scope.row.imgList" :key="index" target="_blank" :href="src" type="primary" >{{index!=0?'、':''}}查看</el-link>
                                            </viewer>
                                        </template>
                                        <span v-else>—</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="操作" v-if="btnList.includes('emp/health/report/edit') || btnList.includes('emp/health/report/del')">
                                    <template slot-scope="scope">
                                        <el-button v-if="btnList.includes('emp/health/report/edit')" @click.native.prevent="setHealth(2, scope.row)" type="text" size="small" >编辑</el-button>
                                        <el-button v-if="btnList.includes('emp/health/report/del')" style="color:red" @click.native.prevent="removeRow(scope.row.healthReportId,3)" type="text" size="small" >删除</el-button>
                                    </template>
                                </el-table-column>
                            </el-table>
                        </div>
                        <div class="table" v-show="healthActive == 'journeyCard'">
                            <el-table :data="healthList" style="width: 100%" height="500" border :stripe="true">
                                <el-table-column prop="date" label="更新日期"></el-table-column>
                                <!-- <el-table-column prop="codeState" label="行程卡颜色">
                                    <template slot-scope="scope">
                                        <span v-if="scope.row.codeState == 'green'">绿码</span>
                                        <span v-if="scope.row.codeState == 'red'">红码</span>
                                        <span v-if="scope.row.codeState == 'yellow'">黄码</span>
                                        <span v-if="scope.row.codeState == 'orange'">橙码</span>
                                        <span v-if="scope.row.codeState == ''">—</span>
                                    </template>
                                </el-table-column> -->
                                <el-table-column prop="journey" label="说明" :show-overflow-tooltip="true"></el-table-column>
                                <el-table-column prop="imgList" label="文件">
                                    <template slot-scope="scope">
                                        <template v-if="scope.row.imgList && scope.row.imgList.length > 0">
                                            <viewer :images="scope.row.imgList">
                                                <!-- <img :style="{width: '45px',height: '45px','margin-right': '5px',cursor: 'pointer'}" v-for="(src, index) in scope.row.imgList" :src="src" :key="index"/> -->
                                                <el-link v-for="(src, index) in scope.row.imgList" :key="index" target="_blank" :href="src" type="primary" >{{index!=0?'、':''}}查看</el-link>
                                            </viewer>
                                        </template>
                                        <span v-else>—</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="操作" v-if="btnList.includes('emp/health/report/edit') || btnList.includes('emp/health/report/del')">
                                    <template slot-scope="scope">
                                        <el-button
                                            v-if="btnList.includes('emp/health/report/edit')"
                                            @click.native.prevent="setHealth(2, scope.row)"
                                            type="text"
                                            size="small"
                                            >编辑</el-button>
                                        <el-button
                                            v-if="btnList.includes('emp/health/report/del')"
                                            style="color:red"
                                            @click.native.prevent="removeRow(scope.row.healthReportId,3)"
                                            type="text"
                                            size="small"
                                            >删除</el-button
                                        >
                                    </template>
                                </el-table-column>
                            </el-table>
                        </div>
                        <div class="table" v-show="healthActive == 'testRecord'">
                            <el-table :data="healthList" style="width: 100%" height="500" border :stripe="true">
                                <el-table-column prop="date" label="检测日期"></el-table-column>
                                <el-table-column prop="testResult" label="检测结果">
                                    <template slot-scope="scope">
                                        <span v-if="scope.row.testResult == '1'">阴性</span>
                                        <span v-if="scope.row.testResult == '2'">阳性</span>
                                    </template>
                                </el-table-column>
                                <el-table-column prop="expDate" label="失效日期"></el-table-column>
                                <el-table-column prop="imgList" label="图片">
                                    <template slot-scope="scope">
                                        <template v-if="scope.row.imgList && scope.row.imgList.length > 0">
                                            <viewer :images="scope.row.imgList">
                                                <img :style="{width: '45px',height: '45px','margin-right': '5px',cursor: 'pointer'}" v-for="(src, index) in scope.row.imgList" :src="src" :key="index"/>
                                            </viewer>
                                        </template>
                                        <span v-else>—</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="操作" v-if="btnList.includes('emp/health/report/edit') || btnList.includes('emp/health/report/del')">
                                    <template slot-scope="scope">
                                        <el-button
                                            v-if="btnList.includes('emp/health/report/edit')"
                                            @click.native.prevent="setHealth(2, scope.row)"
                                            type="text"
                                            size="small"
                                            >编辑</el-button>
                                        <el-button
                                            v-if="btnList.includes('emp/health/report/del')"
                                            style="color:red"
                                            @click.native.prevent="removeRow(scope.row.healthReportId,3)"
                                            type="text"
                                            size="small"
                                            >删除</el-button>
                                    </template>
                                </el-table-column>
                            </el-table>
                        </div>
                        <div class="table" v-show="healthActive == 'vaccination'">
                            <el-table :data="healthList" style="width: 100%" height="500" border :stripe="true">
                                <el-table-column prop="firstTime" label="首次接种时间"></el-table-column>
                                <el-table-column prop="secondTime" label="二次接种时间"></el-table-column>
                                <el-table-column prop="imgList" label="图片">
                                    <template slot-scope="scope">
                                        <template v-if="scope.row.imgList && scope.row.imgList.length > 0">
                                            <viewer :images="scope.row.imgList">
                                                <img
                                                    :style="{width: '45px',height: '45px','margin-right': '5px',cursor: 'pointer'}"
                                                    v-for="(src, index) in scope.row.imgList"
                                                    :src="src"
                                                    :key="index"
                                                />
                                            </viewer>
                                        </template>
                                        <span v-else>—</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="操作" v-if="btnList.includes('emp/health/report/edit') || btnList.includes('emp/health/report/del')">
                                    <template slot-scope="scope">
                                        <el-button
                                            v-if="btnList.includes('emp/health/report/edit')"
                                            @click.native.prevent="setHealth(2, scope.row)"
                                            type="text"
                                            size="small"
                                            >编辑</el-button>
                                        <el-button
                                            v-if="btnList.includes('emp/health/report/del')"
                                            style="color:red"
                                            @click.native.prevent="removeRow(scope.row.healthReportId,3)"
                                            type="text"
                                            size="small"
                                            >删除</el-button>
                                    </template>
                                </el-table-column>
                            </el-table>
                        </div>
                        <div class="clearfix" v-show="healthList.length > 0" style="margin: 20px auto; display: flex;justify-content: center;">
                            <div class="float-right">
                                <Page
                                    v-if="totalCount_health"
                                    :current.sync="current_health"
                                    :total="totalCount_health"
                                    :page-size="pageSize_health"
                                    show-elevator
                                    show-total
                                    @on-change="pageChange_health"
                                ></Page>
                            </div>
                        </div>
                    </TabPane>
                    <!-- <TabPane label="风险告知" v-if="btnList.includes('emp/risk/btn')" name="10">
                        <el-table :data="riskList" style="width: 100%" height="500" border :stripe="true">
                            <el-table-column prop="name" label="风险告知书名称">
                                <template slot-scope="scope">
                                    <div class="p" v-if="scope.row.fileUrl" style="display: flex;justify-content: flex-start;align-items: center;cursor: pointer" @click="download(scope.row.fileUrl,scope.row.name)">
                                        <img style="width: 20px;height: 20px;" src="./../../assets/images/emp/common/file-word.png" v-if="wordList.includes(extname(scope.row.fileUrl))"/>
                                        <img style="width: 20px;height: 20px;" src="./../../assets/images/emp/common/file-excel.png" v-else-if="excelList.includes(extname(scope.row.fileUrl))" />
                                        <img style="width: 20px;height: 20px;" src="./../../assets/images/emp/common/file-ppt.png" v-else-if="pptList.includes(extname(scope.row.fileUrl))"/>
                                        <img style="width: 20px;height: 20px;" src="./../../assets/images/emp/common/file-pdf.png" v-else-if="pdfList.includes(extname(scope.row.fileUrl))"/>
                                        <img style="width: 20px;height: 20px;" src="./../../assets/images/emp/common/file-video.png" v-else-if="videoList.includes(extname(scope.row.fileUrl))"/>
                                        <img style="width: 20px;height: 20px;" src="./../../assets/images/emp/common/file-audio.png" v-else-if="audioList.includes(extname(scope.row.fileUrl))"/>
                                        <img style="width: 20px;height: 20px;" src="./../../assets/images/emp/common/file-zip.png" v-else-if="zipList.includes(extname(scope.row.fileUrl))"/>
                                        <img style="width: 20px;height: 20px;" src="./../../assets/images/emp/common/file-txt.png" v-else-if="txtList.includes(extname(scope.row.fileUrl))"/>
                                        <span style="color: #1891FF">{{scope.row.name}}</span>
                                    </div>
                                    <div class="p" v-else>
                                        <span>—</span>
                                    </div>
                                </template>
                            </el-table-column>
                            <el-table-column prop="signImgUrl" label="签名图片">
                                <template slot-scope="scope">
                                    <template v-if="scope.row.signImgUrl">
                                        <viewer :images="[scope.row.signImgUrl]">
                                            <img :style="{width: '45px',height: '45px','margin-right': '5px',cursor: 'pointer'}" :src="scope.row.signImgUrl"/>
                                        </viewer>
                                    </template>
                                    <template v-else>
                                        <span>—</span>
                                    </template>
                                </template>
                            </el-table-column>
                            <el-table-column prop="signTime" label="签名时间"></el-table-column>
                            <el-table-column label="操作" v-if="btnList.includes('emp/risk/complete')">
                                <template slot-scope="scope"><el-button v-if="btnList.includes('emp/risk/complete')" @click="uploadFn(scope.row.riskId)" type="text" size="small" >电子签名</el-button></template>
                            </el-table-column>
                        </el-table>
                        <div class="clearfix" v-show="riskList.length > 0" style="margin: 20px auto; display: flex;justify-content: center;">
                            <div class="float-right">
                                <Page
                                    v-if="totalCount_risk"
                                    :current.sync="current_risk"
                                    :total="totalCount_risk"
                                    :page-size="pageSize_risk"
                                    show-elevator
                                    show-total
                                    @on-change="pageChange_risk"
                                ></Page>
                            </div>
                        </div>
                    </TabPane> -->
                </Tabs>
            </div>
            <div slot="footer">
                <el-button @click="cancel(10)" type="info" size="small" plain v-if="!isAdd && tabActiveName == 1" >取消</el-button>
                <el-button @click="submitAll(1)" type="primary" size="small" plain v-if="!isAdd && tabActiveName == 1" v-preventReClick="1500" >保存</el-button>
            </div>
        </Modal>
        <!-- 点击拍照 -->
        <Modal v-model="cameraModal" title="点击拍照" width="360px;" :mask-closable="false" :closable="false">
            <div class="close" @click="closeM">
                <i class="el-icon-circle-close" style="font-size:18px"></i>
            </div>
            <div id="contentHolder">
                <video id="video" width="325" height="300" autoplay></video>
                <canvas style="display:none;" id="canvas" width="300" height="300"></canvas>
            </div>
            <div slot="footer">
                <el-button @click="cancel(5)" type="info" size="small" plain>取消</el-button>
                <el-button @click="camera" type="primary" size="small" plain>确定</el-button>
            </div>
        </Modal>
        <!-- 删除 -->
        <Modal v-model="deleteModal" title="删除" width="360px;" :mask-closable="false">
            <div style="margin:10px">确定要删除这条数据吗？</div>
            <div slot="footer">
                <el-button @click="cancel(2)" type="info" size="small" plain>取消</el-button>
                <el-button @click="detele" type="primary" size="small" plain v-preventReClick="1500" >确定</el-button>
            </div>
        </Modal>
        <!-- 绑定安全帽 -->
        <Modal v-model="bindModal" title="绑定安全帽" width="400px;" :mask-closable="false">
            <div class="b_box">
                <span class="tip">*</span>
                <span>硬件sn码：</span>
                <Input v-model="bind_sn" placeholder="请输入硬件sn码" style="width: 200px" clearable />
            </div>
            <div slot="footer">
                <el-button @click="cancel(3)" type="info" size="small" plain>取消</el-button>
                <el-button @click="sumBind" type="primary" size="small" plain v-preventReClick="1500" >确定</el-button>
            </div>
        </Modal>
        <!-- 解绑 -->
        <Modal v-model="unbindModal" title="解绑" width="360px;" :mask-closable="false">
            <div style="margin:10px">确定解绑安全帽吗？</div>
            <div slot="footer">
                <el-button @click="cancel(4)" type="info" size="small" plain>取消</el-button>
                <el-button @click="sumUnBind" type="primary" size="small" plain v-preventReClick="1500" >确定</el-button>
            </div>
        </Modal>
        <!-- 入职 -->
        <Modal v-model="enterModal" title="入职" width="360px;" :mask-closable="false">
            <div class="item">
                <span>入职时间:</span>
                <DatePicker
                    type="date"
                    placeholder="请选择入职时间"
                    style="width: 200px"
                    v-model="enterTime"
                    :clearable="false"
                ></DatePicker>
            </div>
            <div slot="footer">
                <el-button @click="cancel(6)" type="info" size="small" plain>取消</el-button>
                <el-button @click="subEnterTime" type="primary" size="small" plain v-preventReClick="1500" >确定</el-button>
            </div>
        </Modal>
        <!-- 离职 -->
        <Modal v-model="outModal" title="离职" width="360px;" :mask-closable="false">
            <div class="item">
                <span>离职时间:</span>
                <DatePicker
                    type="date"
                    placeholder="请选择离职时间"
                    style="width: 200px"
                    v-model="outTime"
                    :clearable="false"
                ></DatePicker>
            </div>
            <div slot="footer">
                <el-button @click="cancel(7)" type="info" size="small" plain>取消</el-button>
                <el-button @click="subOutTime" type="primary" size="small" plain v-preventReClick="1500" >确定</el-button>
            </div>
        </Modal>
        <!-- 批量离职 -->
        <Modal v-model="outBatchModal" title="批量离职" width="360px;" :mask-closable="false">
            <div class="item">
                <span>离职时间:</span>
                <DatePicker
                    type="date"
                    placeholder="请选择离职时间"
                    style="width: 200px"
                    v-model="outBatchTime"
                    :clearable="false"
                ></DatePicker>
            </div>
            <div slot="footer">
                <el-button @click="cancel(17)" type="info" size="small" plain>取消</el-button>
                <el-button @click="batchOuter" type="primary" size="small" plain v-preventReClick="1500" >确定</el-button>
            </div>
        </Modal>
        <!-- 添加/编辑资格证书 -->
        <Modal v-model="certUpdateModal" :title="certIsAdd ? '添加资格证书' : '编辑资格证书'" width="500px;" :mask-closable="false">
            <div class="cert_box">
                <span class="tip">*</span>
                <span>证书名称:</span>
                <Input v-model="certName" placeholder="请输入证书名称" style="width: 300px" clearable />
            </div>
            <div class="cert_box">
                <span>技能等级:</span>
                <Select v-model="level" style="width:300px" placeholder="请选择技能等级">
                    <Option v-for="(item, index) in levelList" :value="item" :key="index" >{{ item }}</Option>
                </Select>
            </div>
            <div class="cert_box">
                <span class="tip">*</span>
                <span>证书编号:</span>
                <Input v-model="certCode" placeholder="请输入证书编号" style="width: 300px" clearable />
            </div>
            <div class="cert_box">
                <span class="tip">*</span>
                <span>发证日期:</span>
                <DatePicker
                    type="date"
                    placeholder="请选择发证日期"
                    style="width: 300px"
                    v-model="certStartDate"
                    :clearable="false"
                ></DatePicker>
            </div>
            <div class="cert_box">
                <span class="tip">*</span>
                <span>证件有效期:</span>
                <DatePicker
                    type="date"
                    placeholder="请选择证件有效期"
                    style="width: 300px"
                    v-model="certExpireDate"
                    :clearable="false"
                ></DatePicker>
            </div>
            <div class="cert_box">
                <span class="tip">*</span>
                <span>发证机关:</span>
                <Input v-model="certGrantOrg" placeholder="请输入发证机关" style="width: 300px" clearable />
            </div>
            <div class="cert_box img">
                <span>图片:</span>
                <el-upload
                    :class="{ hideAdd: imgFlag }"
                    ref="uploadImg"
                    :headers="headers"
                    :file-list="imgFileList"
                    :action="$axios.defaults.baseURL + '/ms/api/emp/cert/uploadCertFile'"
                    list-type="picture-card"
                    accept="image/png, image/jpg, image/jpeg"
                    :before-upload="beforeImgUpload"
                    :on-success="reportlogImgSuccess"
                    name="file"
                    :limit="3"
                    style="width: 300px"
                    :on-exceed="exceedImg"
                    :on-remove="handleReportRemove"
                >
                    <i class="el-icon-plus"></i>
                </el-upload>
            </div>
            <div slot="footer">
                <el-button @click="cancel(8)" type="info" size="small" plain>取消</el-button>
                <el-button @click="certSubmit" type="primary" size="small" plain v-preventReClick="1500" >确定</el-button>
            </div>
        </Modal>
        <!-- 删除 -->
        <Modal v-model="certdeleteModal" title="删除" width="360px;" :mask-closable="false">
            <div style="margin:10px">确定要删除这条数据吗？</div>
            <div slot="footer">
                <el-button @click="cancel(9)" type="info" size="small" plain>取消</el-button>
                <el-button @click="certdetele" type="primary" size="small" plain v-preventReClick="1500" >确定</el-button>
            </div>
        </Modal>
        <!-- 添加/编辑银行账号 -->
        <Modal v-model="bankUpdateModal" :title="bankIsAdd ? '添加银行账号' : '编辑银行账户'" width="500px;" :mask-closable="false">
            <div class="cert_box">
                <span class="tip">*</span>
                <span>银行名称:</span>
                <Select v-model="bankCode" style="width:300px" placeholder="请选择银行名称">
                    <Option v-for="(item, index) in bankTypelist" :value="item.code" :key="index" >{{ item.name }}</Option>
                </Select>
            </div>
            <div class="cert_box">
                <span class="tip">*</span>
                <span>开户行:</span>
                <Input v-model="bankName" placeholder="请输入开户行名称" style="width: 300px" clearable />
            </div>
            <div class="cert_box">
                <span class="tip">*</span>
                <span>银行卡号:</span>
                <Input v-model="bankNumber" placeholder="请输入银行卡号" style="width: 300px" clearable />
            </div>
            <div slot="footer">
                <el-button @click="cancel(11)" type="info" size="small" plain>取消</el-button>
                <el-button @click="bankSubmit" type="primary" size="small" plain v-preventReClick="1500" >确定</el-button>
            </div>
        </Modal>
        <!-- 删除 -->
        <Modal v-model="bankdeleteModal" title="删除" width="360px;" :mask-closable="false">
            <div style="margin:10px">确定要删除这条数据吗？</div>
            <div slot="footer">
                <el-button @click="cancel(12)" type="info" size="small" plain>取消</el-button>
                <el-button @click="bankdetele" type="primary" size="small" plain v-preventReClick="1500" >确定</el-button>
            </div>
        </Modal>
        <!-- 删除 -->
        <Modal v-model="contractdeleteModal" title="删除" width="360px;" :mask-closable="false">
            <div style="margin:10px">确定要删除这条数据吗？</div>
            <div slot="footer">
                <el-button @click="cancel(13)" type="info" size="small" plain>取消</el-button>
                <el-button @click="contractdetele" type="primary" size="small" plain v-preventReClick="1500" >确定</el-button>
            </div>
        </Modal>
        <!-- 添加/编辑合同信息 -->
        <Modal v-model="contractUpdateModal" :title="contractIsAdd ? '添加合同信息' : '编辑合同信息'" width="500px;" :mask-closable="false">
            <div class="cert_box">
                <span class="tip">*</span>
                <span>签订状态:</span>
                <div class="radio">
                    <el-radio-group v-model="contract.state">
                        <el-radio :label="0">未签订</el-radio>
                        <el-radio :label="1">已签订</el-radio>
                    </el-radio-group>
                </div>
            </div>
            <div class="cert_box">
                <span class="tip">*</span>
                <span>合同编号:</span>
                <Input v-model="contract.contractNo" placeholder="请输入合同编号" style="width: 300px" clearable />
            </div>
            <div class="cert_box">
                <span class="tip">*</span>
                <span>合同期限:</span>
                <div class="radio">
                    <el-radio-group v-model="contract.contactType">
                        <el-radio :label="0">固定期限</el-radio>
                        <el-radio :label="1">固定工作量</el-radio>
                    </el-radio-group>
                </div>
            </div>
            <div class="cert_box">
                <span class="tip">*</span>
                <span>有效期:</span>
                <DatePicker
                    type="daterange"
                    :clearable="false"
                    placeholder="请选择日期"
                    style="width: 300px"
                    v-model="value"
                    @on-change="getContractTime"
                ></DatePicker>
            </div>
            <div class="cert_box">
                <span>工作核定方式:</span>
                <Select v-model="payType" style="width:300px" placeholder="请选择工作核定方式">
                    <Option v-for="(item, index) in payTypeList" :value="item.id" :key="index" >{{ item.name }}</Option>
                </Select>
            </div>
            <div class="cert_box">
                <span>单价（元）:</span>
                <Input v-model="contract.salary" placeholder="请输入单价" style="width: 300px" clearable />
            </div>
            <div class="dowm">
                <span>附件</span>
                <div class="upload">
                    <el-button type="primary" size="small" plain>上传附件</el-button>
                    <!-- <span style="color:red">可上传最大为 5.0 MB文件。如果文件比较大请先压缩文件</span> -->
                    <input id="upload_contractfile" type="file" @change="getcontractFile" accept=".jpg, .png, .pdf" style="position: absolute;left:0;top:18px;height:32px;opacity: 0; width:80px;" />
                </div>
                <ul v-if="contract.fileAttachList.length > 0">
                    <li v-for="(item, index) in contract.fileAttachList" :key="index">
                        <span @click="contractFile(item)">{{ item.name }}</span>
                        <span @click="removecontractFile(index)">
                            <i class="el-icon-delete"></i>
                        </span>
                    </li>
                </ul>
                <p v-show="!contract.fileAttachList || contract.fileAttachList.length == 0" style=" font-size:12px;margin-left:5px;margin-top:10px">
                    暂无附件
                </p>
            </div>
            <div slot="footer">
                <el-button @click="cancel(14)" type="info" size="small" plain>取消</el-button>
                <el-button @click="contractSubmit" type="primary" size="small" plain v-preventReClick="1500" >确定</el-button>
            </div>
        </Modal>

        <div class="previewImgModal" v-if="previewImgModal">
            <span class="close" @click="previewImgClose">
                <Icon type="ios-close-circle" style="color:#fff;font-size:24px;" />
            </span>
            <img :src="previewImg" />
        </div>

        <Modal v-model="healthModal" :title="healthTitle" width="500px;" :mask-closable="false">
            <div class="cert_box" v-if="healthActive != 'vaccination'">
                <span v-if="healthActive == 'healthCode' || healthActive == 'journeyCard'">到期时间:</span>
                <span v-if="healthActive == 'testRecord'">更新日期:</span>
                <DatePicker
                    type="date"
                    :options="options"
                    :clearable="true"
                    v-model="health_submit_data.date"
                    format="yyyy-MM-dd"
                    placement="top"
                    transfer
                    placeholder="请选择日期"
                    style="width: 300px;"
                ></DatePicker>
            </div>
            <!-- <div class="cert_box" v-if="healthActive == 'healthCode' || healthActive == 'journeyCard'">
                <span>社保:</span>
                <RadioGroup v-model="health_submit_data.codeState">
                    <Radio label="green">城市社保</Radio>
                    <Radio label="red">农村社保</Radio>
                    <Radio label="yellow">其它</Radio>
                    <Radio label="orange" v-if="healthActive == 'journeyCard'">橙码</Radio>
                </RadioGroup>
            </div> -->
            <div class="cert_box" v-if="healthActive == 'testRecord'">
                <span>检测结果:</span>
                <RadioGroup v-model="health_submit_data.testResult">
                    <Radio label="1">阴性</Radio>
                    <Radio label="2">阳性</Radio>
                </RadioGroup>
            </div>
            <div class="cert_box" v-if="healthActive == 'testRecord'">
                <span>失效日期:</span>
                <DatePicker
                    type="date"
                    :clearable="true"
                    v-model="health_submit_data.expDate"
                    format="yyyy-MM-dd"
                    placement="top"
                    transfer
                    placeholder="请选择日期"
                    style="width: 300px;"
                ></DatePicker>
            </div>
            <div class="cert_box" v-if="healthActive == 'journeyCard'">
                <span>报告说明:</span>
                <Input v-model="health_submit_data.journey" placeholder="请输入" type="textarea" :maxlength="250" style="width: 300px" clearable />
            </div>
            <div class="cert_box" v-if="healthActive == 'vaccination'">
                <span>首次接种时间:</span>
                <DatePicker
                    type="date"
                    :options="options"
                    :clearable="true"
                    v-model="health_submit_data.firstTime"
                    format="yyyy-MM-dd"
                    placement="top"
                    transfer
                    placeholder="请选择日期"
                    style="width: 300px;"
                ></DatePicker>
            </div>
            <div class="cert_box" v-if="healthActive == 'vaccination'">
                <span>二次接种时间:</span>
                <DatePicker
                    type="date"
                    :clearable="true"
                    v-model="health_submit_data.secondTime"
                    format="yyyy-MM-dd"
                    placement="top"
                    transfer
                    placeholder="请选择日期"
                    style="width: 300px;"
                ></DatePicker>
            </div>
            <div class="cert_box img" style="align-items: flex-start">
                <span>证明文件:</span>
                <!-- image/jpeg,image/png,image/gif,image/bmp,image/webp, .doc,.docx,.xls,.xlsx,.pdf-->
                <el-upload
                    :class="{ hideAdd: imgFlag }"
                    ref="uploadImg"
                    :file-list="imgFileList"
                    :headers="headers"
                    :action="$axios.defaults.baseURL + '/ms/api/emp/health/report/upload/img'"
                    list-type="picture-card"
                    accept="image/png, image/jpg, image/jpeg, .pdf"
                    :before-upload="beforeImgUpload"
                    :on-success="reportlogImgSuccess"
                    name="file"
                    :limit="3"
                    style="width: 300px"
                    :on-exceed="exceedImg"
                    :on-remove="handleReportRemove"
                >
                    <i class="el-icon-plus"></i>
                </el-upload>
            </div>
            <div slot="footer">
                <el-button @click="cancel(15)" type="info" size="small" plain>取消</el-button>
                <el-button @click="healthSubmit" type="primary" size="small" plain v-preventReClick="1500" >确定</el-button>
            </div>
        </Modal>

        <Modal v-model="confessModal" :title="confessIsAdd ? '添加安全交底记录' : '编辑安全交底记录'" width="500px;" :mask-closable="false">
            <div class="cert_box">
                <span class="tip">*</span>
                <span>工程名称:</span>
                <Input v-model="confess_submit_data.projectName" placeholder="请输入" :maxlength="30" style="width: 300px" clearable />
            </div>
            <div class="cert_box">
                <span class="tip">*</span>
                <span>交底日期:</span>
                <DatePicker
                    type="date"
                    :options="options"
                    :clearable="true"
                    v-model="confess_submit_data.date"
                    format="yyyy-MM-dd"
                    placement="top"
                    transfer
                    placeholder="请选择日期"
                    style="width: 300px;"
                ></DatePicker>
            </div>
            <div class="cert_box">
                <span>施工单位:</span>
                <Select filterable v-model="confess_submit_data.corpId" style="width:300px" placeholder="请选择" @on-change="getCorpName">
                    <Option v-for="(item, index) in corpList" :value="item.corpId" :key="index" >{{ item.corpName }}</Option>
                </Select>
            </div>
            <div class="cert_box">
                <span>交底人:</span>
                <Select filterable v-model="confess_submit_data.confidantId" style="width:300px" placeholder="请选择" @on-change="getConfidantName">
                    <Option v-for="(item, index) in userList" :value="item.empId" :key="index" >{{ item.empName }}</Option>
                </Select>
            </div>
            <div class="cert_box">
                <span>被交底人:</span>
                <Select filterable v-model="confess_submit_data.beConfidantId" style="width:300px" placeholder="请选择" @on-change="getBeConfidantName">
                    <Option v-for="(item, index) in userList" :value="item.empId" :key="index" >{{ item.empName }}</Option>
                </Select>
            </div>
            <div class="cert_box img">
                <span>文件说明:</span>
                <el-upload
                    :class="{ hideAdd: imgFlag }"
                    :data="{ module: 'confess' }"
                    ref="uploadImg"
                    :headers="headers"
                    :file-list="imgFileList"
                    :action="$axios.defaults.baseURL + '/ms/api/emp/upload/img'"
                    list-type="picture-card"
                    accept="image/png, image/jpg, image/jpeg, .pdf"
                    :before-upload="beforeImgUpload"
                    :on-success="reportlogImgSuccess"
                    name="file"
                    :limit="3"
                    style="width: 300px"
                    :on-exceed="exceedImg"
                    :on-remove="handleReportRemove"
                >
                    <i class="el-icon-plus"></i>
                </el-upload>
            </div>
            <div slot="footer">
                <el-button @click="cancel(16)" type="info" size="small" plain>取消</el-button>
                <el-button @click="confessSubmit" type="primary" size="small" plain v-preventReClick="1500" >确定</el-button>
            </div>
        </Modal>

        <delModal
            :delModal="delModal"
            :delId="delId"
            :delContent="delContent"
            :setDelFn="delIndex == 3 ? getEmpHealthReportDel : getEmpConfessDel"
            @handleDelClose="handleDelClose"
            @handleDelSubmit="handleDelSubmit"
        ></delModal>

        <Modal v-model="uploadModal" title="签名" width="360px;" :mask-closable="false">
            <div style="margin:10px">是否签名成功？</div>
            <div slot="footer">
                <el-button @click="cancel(100)" type="info" size="small" plain>取消</el-button>
                <el-button @click="submitSgin" type="primary" size="small" plain v-preventReClick="1500" >确定</el-button>
            </div>
        </Modal>

        <!-- 安全帽弹出层 -->
        <div class="safetyHatPop" v-if="safetyHatShow">
            <div class="contentBox">
                <div class="picture"><img src='../../assets/svg/safetyHat.svg'/></div>
                <div class="text">
                    操作提示：
                    <p>选择某一个人员信息，在【操作】这列点击[绑定]菜单，在弹出的对话框中，输入安全帽芯片 SN序列码，确定即可绑定成功！</p>
                    <div class="safetyHatOK" @click="safetyHatHide">我知道啦</div>
                </div>
            </div>
        </div>

        <Modal
            v-model="userModal"
            :mask-closable="false"
            width="900px;">
            <span>弹窗</span>
            <Tabs v-model="tabActiveName">
                <TabPane
                    :label="isAdd ? '添加新账号' : '编辑账号'"
                    name="1">
                    <div class="top">
                        <div class="list">
                            <div class="item2">
                                <span class="tip">*</span>
                                <span>用户名:</span>
                                <Input
                                    v-model="username"
                                    placeholder="请输入账号编号"
                                    :maxlength="lengths"
                                    show-word-limit
                                    style="width: 300px"
                                    clearable />
                            </div>
                            <div class="item2">
                                <span class="tip">*</span>
                                <span>姓名:</span>
                                <Input
                                    v-model="nickname"
                                    placeholder="请输入姓名"
                                    :maxlength="lengths"
                                    show-word-limit
                                    style="width: 300px"
                                    clearable />
                            </div>
                        </div>
                        <div class="list">
                            <div
                                class="item2"
                                v-if="isAdd == true">
                                <span class="tip">*</span>
                                <span>密码:</span>
                                <Input
                                    v-model="password"
                                    placeholder="请输入密码"
                                    style="width: 300px"
                                    type="password"
                                    clearable />
                            </div>
                            <div
                                class="item2"
                                v-if="isAdd == true">
                                <span class="tip">*</span>
                                <span>确认密码:</span>
                                <Input
                                    v-model="passwordagain"
                                    placeholder="请确认密码"
                                    style="width: 300px"
                                    type="password"
                                    clearable />
                            </div>
                        </div>
                        <div class="list">
                            <div class="item2">
                                <span class="tip">*</span>
                                <span>手机号:</span>
                                <Input
                                    v-model="phone"
                                    placeholder="请输入手机号"
                                    style="width: 300px"
                                    clearable />
                            </div>
                            <div class="item2">
                                <span>邮箱:</span>
                                <Input
                                    v-model="email"
                                    placeholder="请输入邮箱"
                                    style="width: 300px"
                                    clearable />
                            </div>
                        </div>
                        <div class="list">
                            <div class="item2">
                                <span class="tip">*</span>
                                <span>账号类型:</span>
                                <div style="width: 300px">
                                    <el-radio
                                        v-model="type"
                                        label="2"
                                        >普通账号</el-radio
                                    >
                                    <el-radio
                                        v-model="type"
                                        label="3"
                                        >体验账号</el-radio
                                    >
                                </div>
                            </div>
                            <div
                                class="item2"
                                v-if="typeFlag">
                                <span class="tip">*</span>
                                <span>有效期限:</span>
                                <div style="width: 300px">
                                    <DatePicker
                                        type="date"
                                        placeholder="请选择有限期限"
                                        style="width: 200px"
                                        v-model="expireTime"
                                        :options="options1"
                                        @on-change="getTime"
                                        :transfer="true"></DatePicker>
                                    <span
                                        v-if="textFlag"
                                        style="color: red"
                                        >已过期</span
                                    >
                                </div>
                            </div>
                        </div>

                        <div class="list">
                            <div class="item2">
                                <span class="tip">*</span>
                                <span>项目角色:</span>
                                <el-select v-model="userType" style="width:300px" placeholder="请选择项目角色" :filterable="true" >
                                   <el-option v-for="item in ProjectRoleList" :key="item.value" :label="item.title" :value="item.value" size="mini"></el-option>
                                </el-select>
                            </div>
                        </div>
                    </div>
                    <hr />
                    <p style="margin: 10px 0; font-size: 18px; color: var(--themeColor)">账号角色</p>
                    <div class="bottom">
                        <CheckboxGroup v-model="roleIds">
                            <Checkbox
                                v-for="(val, index) in roleList"
                                :key="index"
                                :label="val.id"
                                style="width: 220px">
                                <span>{{ val.name }}</span>
                            </Checkbox>
                        </CheckboxGroup>
                    </div>
                </TabPane>
                <TabPane
                    label="选择已有帐号"
                    name="2"
                    v-if="isAdd">
                    <div class="imp">
                        <Input
                            search
                            v-model="impKeyword"
                            placeholder="请输入姓名/用户名/手机号"
                            style="width: 300px"
                            clearable />
                    </div>
                    <div
                        class="table"
                        style="width: 96%; margin: 0 auto">
                        <el-table
                            ref="reftable"
                            :data="importList"
                            style="width: 100%"
                            height="300"
                            @select="listSelectOne"
                            @select-all="listSelectALL">
                            <el-table-column
                                type="selection"
                                width="55"
                                align="center"></el-table-column>
                            <el-table-column
                                fixed="left"
                                prop="username"
                                label="用户名"></el-table-column>
                            <el-table-column
                                prop="nickname"
                                label="姓名"></el-table-column>
                            <el-table-column
                                prop="phone"
                                label="电话"></el-table-column>
                        </el-table>
                    </div>
                    <p style="margin: 10px 0; font-size: 18px; color: var(--themeColor)">账号角色</p>
                    <div class="bottom">
                        <CheckboxGroup v-model="improleIds">
                            <Checkbox
                                v-for="(val, index) in roleList"
                                :key="index"
                                :label="val.id"
                                style="width: 220px">
                                <span>{{ val.name }}</span>
                            </Checkbox>
                        </CheckboxGroup>
                    </div>
                </TabPane>
            </Tabs>
            <div slot="footer">
                <el-button
                    @click="cancel(18)"
                    type="info"
                    size="small"
                    plain
                    >取消</el-button
                >
                <el-button
                    @click="addEmpUser"
                    type="primary"
                    size="small"
                    plain
                    v-preventReClick="1500"
                    :loading="EmpUserLoading"
                    >确定</el-button
                >
            </div>
        </Modal>


    </div>
</template>
<script>
import { GetAge } from "@/sever/config.js";
import { format, trim, formatInItDate } from "@/sever/utils.js";
import { previewImg } from "@/mixins/previewImg.js";
import {
    getAllPersonnelList,
    getEmpNum,
    getPersonnelDetails,
    getPersonnelUpload,
    getPersonnelAdd,
    getPersonnelEdit,
    getPersonnelRemove,
    getPersonnelEnter,
    getPersonnelOuter,
    getPersonnelBatchOuter,
    getPersonnelDevicerUnbind,
    getPersonnelDevicerBind,
    getEmpImport,
    getEmpContractUpload,
    getEmpExport,
    getGroupAdd,
    syncEmp,
    getUserImporList,
    getEmpUserAdd,
    getDeptUserImport,
    getDeptUserEdit,
    getUserList,
    getEmpUserImporList
} from "@/api/api.js";
import { GroupCreate } from "@/mixins/group.js";
import { detailsModal } from "./detailsModal";
import delModal from "../delModal";
import { fileType } from "@/mixins/fileType";
import {initFvsList} from "@/mixins/fvs";
import { initSys } from "@/mixins/sys.js"

export default {
    // mixins: [initSys, extra],
    mixins: [GroupCreate, previewImg, detailsModal, fileType,initFvsList,initSys],
    components: { delModal },
    data() {
        return {
            userModal: false,
            isAdd: true,
            tabActiveName: "1",
            username: "",
            nickname: "",
            password: "",
            passwordagain: "",
            phone: "",
            email: "",
            type: "2",
            expireTime: "",
            roleIds: [],
            roleList: [],
            improleIds: [],
            importList: [],
            improtUserList: [],
            impAllList: [],
            impKeyword: "",
            typeFlag: false,
            textFlag: false,
            lengths: 35,
            currentEmp:{},

            workId: "",
            previewList: [], //图片预览
            headers: {
                Authorization:localStorage.getItem('COOKIE'),
            },
            tabActiveName: "1",
            keyword: "",
            postStatelist: [
                {
                    id: 0,
                    name: "全部"
                },
                {
                    id: 1,
                    name: "在职"
                },
                {
                    id: 2,
                    name: "离职"
                }
            ],
            ethnicList: [
                "汉",
                "壮",
                "满",
                "回",
                "苗",
                "维吾尔",
                "土家",
                "彝",
                "蒙古",
                "藏",
                "布依",
                "侗",
                "瑶",
                "朝鲜",
                "白",
                "哈尼",
                "哈萨克",
                "黎",
                "傣",
                "畲",
                "傈僳",
                "仡佬",
                "东乡",
                "高山",
                "拉祜",
                "水",
                "佤",
                "纳西",
                "羌",
                "土",
                "仫佬",
                "锡伯",
                "柯尔克孜",
                "达斡尔",
                "景颇",
                "毛南",
                "撒拉",
                "布朗",
                "塔吉克",
                "阿昌",
                "普米",
                "鄂温克",
                "怒",
                "京",
                "基诺",
                "德昂",
                "保安",
                "俄罗斯",
                "裕固",
                "乌孜别克",
                "门巴族",
                "鄂伦春",
                "独龙",
                "塔塔尔",
                "赫哲",
                "珞巴"
            ],
            gender: "",
            interfaceResult: {
                1: {
                    mean: "端口打开失败",
                    message: "未检测到二代身份证阅读器！"
                },
                2: {
                    mean: "数据传输超时",
                    message: "未检测到二代身份证阅读器！"
                },
                10: {
                    mean: "没有找到卡",
                    message: "未读取到身份证，请重新刷卡！"
                },
                11: {
                    mean: "读卡操作失败",
                    message: "未检测到二代身份证阅读器！"
                },
                20: { mean: "自检失败", message: "二代身份证读取失败！" },
                30: { mean: "其他错误", message: "二代身份证读取失败！" },
                40: { mean: "相片解码失败", message: "二代身份证读取失败！" },
                100: { mean: "超时", message: "未读取到身份证，请重新刷卡！" },
                200: {
                    mean: "GetBase64PhotoData",
                    message: "二代身份证读取失败！"
                }
            },
            bindFlagList: [
                {
                    id: "",
                    name: "安全帽:全部"
                },
                {
                    id: 0,
                    name: "未绑定"
                },
                {
                    id: 1,
                    name: "已绑定"
                }
            ],
            workerTypeList: [
                {
                    id: "",
                    name: "工人类型:全部"
                },
                {
                    id: 2,
                    name: "施工人员"
                },
                {
                    id: 1,
                    name: "管理人员"
                }
            ],
            bindFlag: "",
            postState: 1,
            workRolelist: [
                {
                    id: 1,
                    name: "管理人员"
                },
                {
                    id: 2,
                    name: "施工人员"
                }
            ],
            workRole: "",
            jobTypelist: [],
            jobType: "",
            corp: "",
            list: [],
            current: 1,
            pageSize: 10,
            pageNum: 1,
            totalCount: "",

            isAdd: true,
            updateModel: false,
            educationList: [
                {
                    id: 1,
                    name: "博士后"
                },
                {
                    id: 2,
                    name: "博士"
                },
                {
                    id: 3,
                    name: "研究生"
                },
                {
                    id: 4,
                    name: "硕士"
                },
                {
                    id: 5,
                    name: "本科"
                },
                {
                    id: 6,
                    name: "大专"
                },
                {
                    id: 7,
                    name: "中专"
                },
                {
                    id: 8,
                    name: "高中"
                },
                {
                    id: 9,
                    name: "专科及以下学历"
                },
                {
                    id: 10,
                    name: "其他"
                }
            ],
            degreeList: [
                {
                    id: 1,
                    name: "博士后学位"
                },
                {
                    id: 2,
                    name: "博士学位"
                },
                {
                    id: 3,
                    name: "硕士学位"
                },
                {
                    id: 4,
                    name: "学士学位"
                },
                {
                    id: 5,
                    name: "无学位"
                },
                {
                    id: 6,
                    name: "其他"
                }
            ],
            leaderFlagList: [
                {
                    id: 0,
                    name: "否"
                },
                {
                    id: 1,
                    name: "是"
                }
            ],
            deleteModal: false,
            idcardIMG: "",
            id: "",
            removeID: "",
            bindId: "",
            bindModal: false,
            bind_sn: "",
            unbindID: "",
            unbindModal: false,
            qrcodeId: "",
            link: "",
            cameraModal: false,
            thisCancas: null,
            thisContext: null,
            thisVideo: null,
            avatarIMG: "",
            enterModal: false,
            enterTime: new Date(),
            entObj: {},
            outTime: new Date(),
            outModal: false,
            outObj: {},
            btnList: [],
            detailsIndex: "",
            detailsRows: [],
            projectId: "",
            porjectName: "",
            qrCodeName: "",
            ETime: "",
            OTime: "",
            certIsAdd: false,
            certUpdateModal: false,
            certName: "",
            levelList: ["普工", "初级工", "高级工", "技师", "高级技师"],
            level: "",
            certCode: "",
            certStartDate: "",
            certExpireDate: "",
            certGrantOrg: "",
            fileAttachList: [],
            certId: "",
            certdeleteModal: false,
            certdeteleId: "",
            bzFlag: true,

            CertificateName: "",
            workCardEndDate: "",
            workCardNo: "",
            groupId: "",
            groupName: "",
            treeGroupId: "",
            bankUpdateModal: false,
            bankIsAdd: false,
            bankCode: "",
            bankName: "",
            bankNumber: "",
            bankId: "",
            bankdeleteModal: false,
            tableHeight: window.innerHeight - 335,
            contractdeleteModal: false,
            contractId: "",
            contractUpdateModal: false,
            contractIsAdd: false,
            contract: {
                state: 0,
                contractNo: "",
                contactType: 0,
                startDate: "",
                endDate: "",
                salary: "",
                fileAttachList: []
            },
            value: [],
            payTypeList: [
                {
                    id: 1,
                    name: "按小时"
                },
                {
                    id: 2,
                    name: "按天"
                },
                {
                    id: 3,
                    name: "按月"
                }
            ],
            payType: "",
            empCode: "",
            length: 6,
            numList: ["", "", ""],
            batchList: [],
            outBatchTime: new Date(),
            outBatchModal: false,
            empOuterList: [],
            empTypeId: "",
            expandedKeys: ["C0"],
            expandedCheckedKeys: ["C0"],
            recursiveValue: "",
            recursiveList: "",
            updateModal:false,
            corpType:"",
            groupCode:'',
            workTypeId: "", // 工种id
            workTypeName: "", // 工种name

            responsiblePersonName:'',
            responsiblePersonPhone:'',
            responsibleIdcardType:'',
            cardList:[
                {
                    id: 1,
                    name: "居民身份证"
                },
                {
                    id: 2,
                    name: "澳门永久居民证"
                },
                {
                    id: 3,
                    name: "澳门非永久居民证"
                },
                {
                    id: 4,
                    name: "澳门外地雇员身份识别证"
                },
                {
                    id: 5,
                    name: "澳门特别逗留证"
                }
            ],
            responsibleIdcardNumber:'',
            fvsDeviceId:[],
            fvsDeviceName:'',
            safetyHatShow:false,
            avatarBase64: "",

            // 项目角色 0业主人员-1监理人员-2总包人员-3分包人员-4普通人员
            userType: 4,
            ProjectRoleList: [
                {value: 0, title: '业主人员'},
                {value: 1, title: '监理人员'},
                {value: 2, title: '总包人员'},
                {value: 3, title: '分包人员'},
                {value: 4, title: '普通人员'},
            ],

            EmpUserLoading: false,

        };
    },
    filters: {
        ellipsis(value) {
            if (!value) return "";
            if (value.length > 14) {
                return value.slice(0, 14) + "...";
            } else if (value.length <= 0) {
                return "-";
            }
            return value;
        }
    },
    computed: {
        porjectObject() {
            return this.$store.state.porjectObject;
        }
    },
    watch: {
        type(vlaue, oldvalue) {
            if (vlaue == 2) {
                this.typeFlag = false
            } else if (vlaue == 3) {
                this.typeFlag = true
            }
        },
        porjectObject(val, oldVal) {
            if (val.deptId != oldVal.deptId) {
                this.projectId = val.deptId;
                this.porjectName = val.name;
                this.pageNum = 1;
                this.current = 1;
                this.keyword = "";
                this.gender = "";
                this.postState = 1;
                this.workType = "";
                this.workRole = "";
                this.corp = "";
                this.code = "work_type_total";
                this.getAllList();
                this.getGroupTree();
                this.getGroupAllList();
                this.getNum();
                this.getEmpConfessUserListFn();
                this.getAllCompangListFn();
                // this.getcorpList(this.projectId);
                // this.getFvsList()
            }
        }
    },
    methods: {
        /**
         * @description: 递归查找子节点当中是否有name
         * @param {*} name 需查找的name
         * @param {*} treesNameNode 整个树结构
         */
        findTreeChildren(name, treesNameNode) {
            for (let i = 0; i < treesNameNode.length; i += 1) {
                if (treesNameNode[i].label == name) {
                    this.recursiveList = treesNameNode[i];
                    this.recursiveValue = treesNameNode[i].id;
                    return true;
                }
                if (treesNameNode[i].children) {
                    if (
                        this.findTreeChildren(name, treesNameNode[i].children)
                    ) {
                        return true;
                    }
                }
            }
        },

        /**
         * @description: 批量离职日期弹窗
         */
        outerModal() {
            this.outBatchModal = true;
        },

        /**
         * @description: 批量离职
         */
        batchOuter() {
            let params = {
                empIds: this.empOuterList,
                date: this.$moment(this.outBatchTime).format("YYYY-MM-DD")
            };
            getPersonnelBatchOuter(params)
                .then(res => {
                    if (res.code == 200) {
                        this.$Message.success(res.msg);
                        this.outBatchModal = false;
                        this.getAllList();
                    } else {
                        this.$Message.warning(res.msg);
                    }
                })
                .catch(error => {
                    console.log(error);
                });
        },

        /**
         * @description: 多选回调
         * @param {*} items
         */
        handleSelectionChange(items) {
            this.batchList = [];
            this.empOuterList = [];
            items.forEach(item => {
                this.batchList.push(item.empId);
                this.empOuterList.push(item.empId);
            });
        },

        /**
         * @description: 批量导入人员
         */
        batchImport() {
            let file = this.$refs.uploadEmpFile.files[0];
            let formdata = new FormData();
            //文件类型
            let fileSuffix = file.name
                .substring(file.name.lastIndexOf(".") + 1)
                .toLowerCase();
            if (fileSuffix != "xlsx" && fileSuffix != "xls") {
                this.$Modal.warning({
                    title: "提示",
                    content: "请上传正确的文件格式"
                });
                return;
            }
            formdata.append("file", file, file.name);
            formdata.append("deptId", this.projectId);
            let config = {
                headers: { "Content-Type": "multipart/form-data" }
            };
            getEmpImport(formdata, config)
                .then(res => {
                    if (res.code == 200) {
                        this.$refs.uploadEmpFile.value = "";
                        this.$message({
                            message: "文件正在导入中，请稍后刷新页面查看...",
                            type: "success"
                        });
                    } else {
                        this.$refs.uploadEmpFile.value = "";
                        this.$Message.warning(res.msg);
                    }
                })
                .catch(error => {
                    console.log(error);
                });
        },

        /**
         * @description: 模板下载
         */
        templateDownload() {
            window.open(
                `${this.$Global.fileSite}/common/人员批量导入模板.xlsx`
            );
        },

        setPreview(src) {
            //图片预览
            this.previewList = [];
            this.previewList.push(src);
        },
        firstImgSuccess(res, file) {
            if (res.code == 200) {
                this.crew.idCardFront = res.data;
            } else {
                this.$Message.warning(res.msg);
            }
        },
        secondImgSuccess(res, file) {
            if (res.code == 200) {
                this.crew.idCardBack = res.data;
            } else {
                this.$Message.warning(res.msg);
            }
        },
        beforeAvatarUpload(file) {
            const isLt2M = file.size / 1024 / 1024 < 2;
            if (!isLt2M) {
                this.$Message.error("上传头像图片大小不能超过 2MB!");
            }
            return;
        },
        //导出人员
        downloadExcel() {
            let params = {
                keyword: this.keyword,
                postState: this.postState == 0 ? "" : this.postState,
                deptId: this.projectId,
                workRoleId: this.workRole,
                corpId: this.corp,
                workTypeId: this.workId,
                bindFlag: this.bindFlag,
                groupId: this.treeGroupId
            };
            getEmpExport(params)
                .then(res => {
                    if (res.code == 200) {
                        window.open(res.data.path);
                    } else {
                        this.$Message.warning(res.msg);
                    }
                })
                .catch(error => {
                    console.log(error);
                });
        },
        //获取人员统计
        getNum() {
            let params = {
                keyword: this.keyword,
                deptId: this.projectId,
                workRoleId: this.workRole,
                gender: this.gender,
                corpId: this.corp,
                bindFlag: this.bindFlag,
                groupId: this.treeGroupId,
                workTypeId: this.workId
            };
            getEmpNum(params)
                .then(res => {
                    if (res.code == 200) {
                        this.numList = [
                            res.data.empAllNum,
                            res.data.empOuterNum,
                            res.data.empEnterNum
                        ];
                    } else {
                        this.$Message.warning(res.msg);
                    }
                })
                .catch(error => {
                    console.log(error);
                });
        },
        //获取人员列表
        getAllList() {
            let params = {
                pageSize: this.pageSize,
                pageNum: this.pageNum,
                keyword: this.keyword,
                postState: this.postState == 0 ? "" : this.postState,
                deptId: this.projectId,
                workRoleId: this.workRole,
                gender: this.gender,
                corpId: this.corp,
                bindFlag: this.bindFlag,
                groupId: this.treeGroupId,
                workTypeId: this.workId
            };
            getAllPersonnelList(params)
                .then(res => {
                    if (res.code == 200) {
                        this.list = res.data.list;
                        this.totalCount = res.data.total;
                        for (let i in this.list) {
                            if (this.list[i].birthday) {
                                this.list[i]["age"] = GetAge(
                                    this.list[i].birthday
                                );
                            } else {
                                this.list[i]["age"] = "";
                            }
                        }
                    } else {
                        this.$Message.warning(res.msg);
                    }
                })
                .catch(error => {
                    console.log(error);
                });
        },
        // getALLUserlist() {
        //     let params = {
        //         pageSize: this.pageSize,
        //         pageNum: this.pageNum,
        //         keyword: this.userkeyword,
        //         deptId: this.deptId,
        //     }
        //     getUserList(params)
        //         .then((res) => {
        //             if (res.code == 200) {
        //                 this.userList = res.data.list
        //                 this.userList.forEach((i) => {
        //                     if (i.status == 0) {
        //                         i.status = false
        //                     } else {
        //                         i.status = true
        //                     }
        //                 })
        //                 this.totalCount = res.data.total
        //             } else {
        //                 this.$Message.warning(res.msg)
        //             }
        //         })
        //         .catch((error) => {
        //             console.log(error)
        //         })
        // },
        getPostType(item) {
            this.pageNum = 1;
            this.current = 1;
            this.postState = item.id;
            this.getAllList();
            this.getNum();
        },
        // getBindType(item) {
        //     this.bindFlag = item;
        //     this.pageNum = 1;
        //     this.current = 1;
        //     this.getAllList();
        //     this.getNum();
        // },
        // getWorkRole(item) {
        //     this.workRole = item;
        //     this.pageNum = 1;
        //     this.current = 1;
        //     this.getAllList();
        //     this.getNum();
        // },
        // getWorkType(item) {
        //     this.workId = item;
        //     this.pageNum = 1;
        //     this.current = 1;
        //     this.getAllList();
        //     this.getNum();
        // },
        // getSearch() {
        //     this.pageNum = 1;
        //     this.current = 1;
        //     this.getAllList();
        //     this.getNum();
        // },
        onSerch() {
            this.pageNum = 1;
            this.current = 1;
            this.getAllList();
            this.getNum();
        },
        onReset() {
            this.bindFlag = null
            this.workRole = null
            this.workId = null
            this.keyword = null
            this.pageNum = 1;
            this.current = 1;
            this.getAllList();
            this.getNum();
        },
        pageChange(index) {
            if (this.gender == undefined) {
                this.gender = "";
            }
            if (this.postState == undefined) {
                this.postState = "";
            }
            if (this.workRole == undefined) {
                this.workRole = "";
            }
            if (this.corp == undefined) {
                this.corp = "";
            }
            if (this.bindFlag == undefined) {
                this.bindFlag = "";
            }
            this.pageNum = index;
            this.getAllList();
        },

        pageSizeChange(index) {
            if (this.gender == undefined) {
                this.gender = "";
            }
            if (this.postState == undefined) {
                this.postState = "";
            }
            if (this.workRole == undefined) {
                this.workRole = "";
            }
            if (this.corp == undefined) {
                this.corp = "";
            }
            if (this.bindFlag == undefined) {
                this.bindFlag = "";
            }
            this.pageSize = index;
            this.getAllList();
        },
        getethnicType(index) {
            this.crew.nation = index;
        },
        getDetails(index, rows) {
            this.tabActiveName = "1";
            this.healthActive = "healthCode";
            let params = {
                empId: rows[index].empId
            };
            this.detailsIndex = index;
            this.detailsRows = rows;
            this.isAdd = true;
            getPersonnelDetails(params)
                .then(res => {
                    if (res.code == 200) {
                        this.detailsModal = true;
                        this.detailsObj = res.data;
                        this.qrCodes(this.detailsIndex, this.detailsRows);
                        this.age = res.data.birthday
                            ? GetAge(res.data.birthday)
                            : "";
                    } else {
                        this.$Message.warning(res.msg);
                    }
                })
                .catch(error => {
                    console.log(error);
                });
        },
        edit_btn() {
            this.updateRow(1, this.detailsIndex, this.detailsRows);
        },
        // 添加班组
        addClass(){
            this.updateModal=true
            this.groupName = "";
            this.corpType ="";
            this.responsiblePersonName="";
            this.responsiblePersonPhone ="";
            this.responsibleIdcardType="";
            this.responsibleIdcardNumber ="";
            this.groupCode ="";
            this.fvsDeviceId = [];
            this.fvsDeviceName ="";
        },
        //视频硬件
        getFvsDeviceName(value, selectedData) {
            this.fvsDeviceId = value;
            this.fvsDeviceName = selectedData.map(o => o.label).join('/');
        },
        //0->新增, 1-> 编辑
        updateRow(type, index, rows) {
            this.CertificateType = 1;
            if (type == 0) {
                this.updateModel = true;
                this.isAdd = true;
                this.bzFlag = true;
                this.getcrew();
            } else {
                this.id = rows[index].empId;
                this.isAdd = false;
                this.crew.postState = this.detailsObj.postState;
                this.crew.name = this.detailsObj.empName;
                this.crew.phone = this.detailsObj.phone;
                this.crew.gender = this.detailsObj.gender;
                this.crew.birthday = this.detailsObj.birthday;
                this.crew.avatar = this.detailsObj.headImg ? this.detailsObj.headImg : require("./../../assets/images/emp/common/userImage.png");
                this.crew.idCardNo = this.detailsObj.idCardNo;
                this.crew.idCardFront = this.detailsObj.idCardFront;
                this.crew.idCardBack = this.detailsObj.idCardBack;
                this.crew.idCardGrantOrg = this.detailsObj.idCardGrantOrg;
                this.crew.idCardStartDate = this.detailsObj.idCardStartDate;
                this.crew.idCardEndDate = this.detailsObj.idCardEndDate;
                this.crew.nation = this.detailsObj.nation;
                this.crew.address = this.detailsObj.address;
                this.crew.hometown = this.detailsObj.hometown;
                this.crew.education = this.detailsObj.education;
                this.crew.degree = parseInt(this.detailsObj.degree);
                this.crew.avatar = this.detailsObj.avatar;
                this.crew.workRoleId = this.detailsObj.workRoleId;
                this.crew.leaderFlag = this.detailsObj.leaderFlag;
                this.crew.personId = this.detailsObj.personId;
                this.crew.corpName = this.detailsObj.corpName;
                this.crew.workRoleName = this.detailsObj.workRoleName;
                this.crew.workTypeName = this.detailsObj.workTypeName;
                this.crew.enterTime = this.detailsObj.enterTime;
                this.crew.outerTime = this.detailsObj.outerTime;
                this.crew.sn = this.detailsObj.sn || "";
                this.CertificateType = this.detailsObj.cardType;
                this.workCardNo = this.detailsObj.workCardNo;
                this.workCardEndDate = this.detailsObj.workCardEndDate;
                this.groupId = this.detailsObj.groupId;
                this.groupName = this.detailsObj.groupName;
                this.empCode = this.detailsObj.empCode;
                this.CertificateTypeList.forEach(i => {
                    if (i.id == this.CertificateType) {
                        this.CertificateName = i.name;
                    }
                });
                if (this.detailsObj.workRoleId == 2) {
                    this.bzFlag = true;
                    // this.crew.leaderFlag = 0
                } else if (this.detailsObj.workRoleId == 1) {
                    this.bzFlag = false;
                }
                this.getworkTypeList(this.projectId);
            }
        },
        getavatar(e) {
            let file
            if (this.isAdd) {
                file = document.getElementById("upload_file2").files[0];
            } else {
                file = document.getElementById("upload_file3").files[0];
            }

            let that = this
            const fr = new FileReader();
            fr.readAsDataURL(file);
            fr.onload = (result) => {
                // that.avatarBase64 = result.currentTarget.result.replace("data:image/jpeg;base64,", "");
                that.avatarBase64 = result.currentTarget.result.split("base64,")[1]
            }

            let size = file.size;
            let fileSize = Math.ceil(size / 1024 / 1024);
            if (fileSize > 5) {
                this.$Modal.warning({
                    title: "提示",
                    content: "请上传小于5M的照片"
                });
                return;
            }
            var formdata = new FormData();
            formdata.append("file", file, file.name);
            let config = {
                headers: { "Content-Type": "multipart/form-data" }
            };
            getPersonnelUpload(formdata, config)
                .then(res => {
                    if (res.code == 200) {
                        this.crew.avatar = res.data;
                        //上传成功之后清除历史记录
                        if (this.isAdd) {
                            document.getElementById("upload_file2").value = "";
                        } else {
                            document.getElementById("upload_file3").value = "";
                        }
                    } else {
                        this.$Message.warning(res.msg);
                    }
                })
                .catch(error => {
                    console.log(error);
                });
        },
        //班组树形结构
        getGroupTree() {
            this.getListTreeList(this.projectId);
        },
        onSecach() {
            this.getGroupTree();
        },
        getTreeId(index) {
            if (index.id === 0) {
                this.corp = "";
                this.treeGroupId = "";
            } else {
                if (index.children) {
                    this.corp = index.id.replace("C", "");
                    this.treeGroupId = "";
                } else {
                    this.treeGroupId = index.id.replace("G", "");
                    this.corp = "";
                }
            }
            this.pageNum = 1;
            this.current = 1;
            this.getNum();
            this.getAllList();
        },
        //拍照
        getCream() {
            this.cameraModal = true;
            this.$nextTick(function() {
                var _this = this;
                this.thisCancas = document.getElementById("canvas");
                this.thisContext = this.thisCancas.getContext("2d");
                this.thisVideo = document.getElementById("video");
                if (navigator.mediaDevices === undefined) {
                    navigator.mediaDevices = {};
                }
                // 一些浏览器实现了部分mediaDevices，我们不能只分配一个对象
                // 使用getUserMedia，因为它会覆盖现有的属性。
                // 这里，如果缺少getUserMedia属性，就添加它。
                if (navigator.mediaDevices.getUserMedia === undefined) {
                    navigator.mediaDevices.getUserMedia = function(
                        constraints
                    ) {
                        // 首先获取现存的getUserMedia(如果存在)
                        var getUserMedia =
                            navigator.webkitGetUserMedia ||
                            navigator.mozGetUserMedia ||
                            navigator.getUserMedia;
                        // 有些浏览器不支持，会返回错误信息
                        // 保持接口一致
                        if (!getUserMedia) {
                            return Promise.reject(
                                new Error(
                                    "getUserMedia is not implemented in this browser"
                                )
                            );
                        }
                        // 否则，使用Promise将调用包装到旧的navigator.getUserMedia
                        return new Promise(function(resolve, reject) {
                            getUserMedia.call(
                                navigator,
                                constraints,
                                resolve,
                                reject
                            );
                        });
                    };
                }
                var constraints = {
                    audio: false,
                    video: {
                        width: this.videoWidth,
                        height: this.videoHeight,
                        transform: "scaleX(-1)"
                    }
                };
                navigator.mediaDevices
                    .getUserMedia(constraints)
                    .then(function(stream) {
                        // 旧的浏览器可能没有srcObject
                        if ("srcObject" in _this.thisVideo) {
                            _this.thisVideo.srcObject = stream;
                        } else {
                            // 避免在新的浏览器中使用它，因为它正在被弃用。
                            _this.thisVideo.src = window.URL.createObjectURL(
                                stream
                            );
                        }
                        _this.thisVideo.onloadedmetadata = function(e) {
                            _this.thisVideo.play();
                        };
                    })
                    .catch(err => {
                        this.cameraModal = false;
                        this.$Modal.warning({
                            title: "未检测到摄像头",
                            content: "请手动上传照片或者安装摄像头"
                        });
                        return;
                    });
            });
        },
        camera() {
            this.thisContext.drawImage(this.thisVideo, 0, 0, 300, 300);
            var image = this.thisCancas.toDataURL("image/png");
            var index = image.lastIndexOf(",");
            image = image.substring(index + 1, image.length);
            this.avatarBase64 = image
            let config = {
                headers: { "Content-Type": "multipart/form-data" }
            };
            var formdata = new FormData();
            formdata.append("base64Str", image);
            getPersonnelUpload(formdata, config)
                .then(res => {
                    if (res.code == 200) {
                        this.crew.avatar = res.data;
                        this.$Message.success("拍照成功");
                        this.thisVideo.srcObject.getTracks()[0].stop();
                        this.cameraModal = false;
                    } else {
                        this.$Message.warning(res.msg);
                    }
                })
                .catch(error => {
                    console.log(error);
                });
        },
        getRandomNum() {
            var random = parseInt(Math.random() * 10000);
            return random;
        },
        //根据项目获取班组
        getGroupAllList() {
            this.getGRPList(this.projectId);
        },
        getworkRole(index) {
            this.workTypelist = [];
            this.crew.workTypeId = "";
            this.crew.leaderFlag = "";
            if (index == 2) {
                this.bzFlag = true;
                this.crew.leaderFlag = 0;
            } else if (index == 1) {
                this.bzFlag = false;
            }
            this.getworkTypeList(this.projectId);
            this.workRolelist.find(i => {
                if (i.id == index) {
                    this.crew.workRoleName = i.name;
                }
            });
        },
        getworkType(index) {
            this.workTypelist.find(i => {
                if (i.workTypeId == index) {
                    this.crew.workTypeName = i.workTypeName;
                }
            });
        },

        /* 班组工种 */
        getGroupWorkType(index) {
            this.workTypelist.find(i => {
                if (i.workTypeId == index) {
                    this.workTypeName = i.workTypeName;
                }
            });
        },
        //读取身份证信息
        getIDCard() {
            let identityParams = {
                "OP-DEV": 1,
                "CMD-URL": 4,
                REPEAT: 1,
                common: 1,
                random: this.getRandomNum()
            };
            this.$axios.get("http://127.0.0.1:24010/ZKIDROnline/ScanReadIdCardInfo", {
                    params: identityParams
                })
                .then(res => {
                    if (res.ret === 0) {
                        let a = res;
                        // this.crew.avatar = "data:image/jpg;base64," + a.Certificate.Base64Photo;
                        this.crew.name = a.Certificate.Name;
                        this.crew.birthday = a.Certificate.Birthday.substring(0, 4) + "-" + a.Certificate.Birthday.substring(4, 6) + "-" + a.Certificate.Birthday.substring(6, 8);
                        this.crew.idCardNo = a.Certificate.IDNumber;
                        this.crew.idCardGrantOrg = a.Certificate.IDIssued;
                        this.crew.idCardStartDate = a.Certificate.IssuedData.substring(0, 4) + "-" + a.Certificate.IssuedData.substring(4, 6) + "-" + a.Certificate.IssuedData.substring(6, 8);
                        this.crew.idCardEndDate = a.Certificate.ValidDate.substring(0, 4) + "-" + a.Certificate.ValidDate.substring(4, 6) + "-" + a.Certificate.ValidDate.substring(6, 8);
                        this.crew.nation = a.Certificate.Nation;
                        this.crew.address = a.Certificate.Address;
                        this.crew.gender = a.Certificate.Sex == "男" ? 1: a.Certificate.Sex == "女" ? 2 : 1
                        let config = {
                            headers: { "Content-Type": "multipart/form-data" }
                        };
                        var formdata = new FormData();
                        formdata.append("base64Str", a.Certificate.Base64Photo);
                        getPersonnelUpload(formdata, config).then(res => {
                                if (res.code == 200) {
                                    this.idcardIMG = res.data;
                                    this.crew.avatar = res.data;
                                } else {
                                    this.$Message.warning(res.msg);
                                }
                            })
                            .catch(error => {
                                console.log(error);
                            });
                    } else {
                        this.$Modal.warning({
                            title: this.interfaceResult[res.ret].mean,
                            content: this.interfaceResult[res.ret].message
                        });
                    }
                })
                .catch(error => {
                    this.$Message.warning("未检测到身份证读取器，请尝试连接后再操作！");
                });
        },
        getCertificateType(index) {
            this.CertificateType = index;
            // this.getcrew();
        },
        idCardStartDateChange(date){
            this.crew.idCardStartDate = date
        },
        idCardEndDateChange(date){
            this.crew.idCardEndDate = date
        },
        //保存
        submitAll(type) {
            this.groupEmpList.forEach(i => {
                if (this.groupId == i.groupId) {
                    this.groupName = i.groupName;
                }
            });
            //非空验证
            let _IDRe18 = /^(^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$)|(^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])((\d{4})|\d{3}[Xx])$)$/;
            let _IDre15 = /^[1-9]\d{5}\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}$/;
            let _IDMacao = /^[157][0-9]{6}\([0-9Aa]\)/;
            if (this.crew.name == "") {
                this.$Modal.warning({
                    title: "您有必填字段",
                    content: "姓名不能为空"
                });
                return;
            }
            if (this.crew.gender == "" || this.crew.gender == undefined) {
                this.$Modal.warning({
                    title: "您有必填字段",
                    content: "请选择性别"
                });
                return;
            }
            if (this.crew.phone != "" && this.crew.phone != undefined) {
                if (!/^1[3456789]\d{9}$/.test(this.crew.phone)) {
                    this.$Modal.warning({
                        title: "您有必填字段",
                        content: "请填写正确的手机号"
                    });
                    return;
                }
            }
            if (this.crew.idCardNo != "") {
                if (
                    !_IDRe18.test(this.crew.idCardNo) &&
                    !_IDMacao.test(this.crew.idCardNo)
                ) {
                    this.$Modal.warning({
                        title: "您有必填字段",
                        content: "请填写正确的身份证号码"
                    });
                    return;
                }
            }
            if (!this.groupId) {
                this.$Modal.warning({
                    title: "您有必填字段",
                    content: "请选择班组"
                });
                return;
            }
            if (
                this.crew.workRoleId == "" ||
                this.crew.workRoleId == undefined
            ) {
                this.$Modal.warning({
                    title: "您有必填字段",
                    content: "请选择工人类型"
                });
                return;
            }
            if (
                this.crew.workTypeId == "" ||
                this.crew.workTypeId == undefined
            ) {
                this.$Modal.warning({
                    title: "您有必填字段",
                    content: "请选择岗位/工种类型"
                });
                return;
            }
            if (this.crew.workRoleId == 2) {
                if (this.crew.leaderFlag === "") {
                    this.$Modal.warning({
                        title: "您有必填字段",
                        content: "请选择是否为班组长"
                    });
                    return;
                }
            }
            // var imglist = document.getElementById('avatar_img');
            // var imgtemp = new Image();
            // var realWidth,realHeight;
            // imgtemp.src = imglist.src;
            // realWidth = imgtemp.width;
            // realHeight = imgtemp.height;
            // if(realWidth<128||realHeight<128){f
            //   this.$Modal.warning({
            //     title: "提示",
            //     content: "图片尺寸过小，最小尺寸为128*128"
            //   });
            //   return;
            // }
            var birthday, idCardStartDate, idCardEndDate, workCardEndDate;
            //生日
            birthday = formatInItDate(this.crew.birthday);
            idCardStartDate = formatInItDate(this.crew.idCardStartDate);
            idCardEndDate = formatInItDate(this.crew.idCardEndDate);
            workCardEndDate = formatInItDate(this.workCardEndDate);
            if (type == 0) {
                this.groupEmpList.forEach(i => {
                    if (this.groupId == i.groupId) {
                        this.groupName = i.groupName;
                    }
                });
                let params = {
                    empName: trim(this.crew.name),
                    phone: this.crew.phone,
                    gender: this.crew.gender == undefined ? "" : this.crew.gender,
                    birthday: birthday,
                    headImg: this.idcardIMG ? this.idcardIMG : "",
                    idCardNo: this.crew.idCardNo,
                    idCardFront: this.crew.idCardFront,
                    idCardBack: this.crew.idCardBack,
                    idCardGrantOrg: this.crew.idCardGrantOrg,
                    idCardStartDate: idCardStartDate,
                    idCardEndDate: idCardEndDate,
                    nation: this.crew.nation,
                    address: this.crew.address,
                    education: this.crew.education == undefined ? "" : this.crew.education,
                    degree: this.crew.degree == undefined ? "" : this.crew.degree,
                    avatar: this.crew.avatar,
                    avatarBase64: this.avatarBase64,
                    workRoleId: this.crew.workRoleId == undefined ? "" : this.crew.workRoleId,
                    workRoleName: this.crew.workRoleName,
                    workTypeId: this.crew.workTypeId == undefined ? "" : this.crew.workTypeId,
                    workTypeName: this.crew.workTypeName == undefined ? "" : this.crew.workTypeName,
                    leaderFlag: this.crew.leaderFlag == undefined ? "" : this.crew.leaderFlag,
                    workCardNo: this.workCardNo,
                    workCardEndDate: workCardEndDate,
                    projectId: this.projectId,
                    cardType: this.CertificateType,
                    groupId: this.groupId,
                    groupName: this.groupName,
                    enterTime: format(this.crew.enterTime, "YYYY-MM-DD"),
                    postState: 1,
                    empCode: this.empCode
                };
                getPersonnelAdd(params)
                    .then(res => {
                        if (res.code == 200) {
                            this.success(type);
                        } else {
                            this.$Message.warning(res.msg);
                        }
                    })
                    .catch(error => {
                        console.log(error);
                    });
            } else if (type == 1) {
                let params = {
                    empId: this.id,
                    empName: trim(this.crew.name),
                    phone: this.crew.phone,
                    gender: this.crew.gender == undefined ? "" : this.crew.gender,
                    birthday: birthday,
                    headImg: this.idcardIMG ? this.idcardIMG : "",
                    idCardNo: this.crew.idCardNo,
                    idCardFront: this.crew.idCardFront,
                    idCardBack: this.crew.idCardBack,
                    idCardGrantOrg: this.crew.idCardGrantOrg,
                    idCardStartDate: idCardStartDate,
                    idCardEndDate: idCardEndDate,
                    nation: this.crew.nation,
                    address: this.crew.address,
                    education: this.crew.education == undefined ? "" : this.crew.education,
                    degree: this.crew.degree == undefined ? "" : this.crew.degree,
                    avatar: this.crew.avatar,
                    avatarBase64: this.avatarBase64,
                    workRoleId: this.crew.workRoleId == undefined ? "" : this.crew.workRoleId,
                    workRoleName: this.crew.workRoleName,
                    workTypeId: this.crew.workTypeId == undefined ? "" : this.crew.workTypeId,
                    workTypeName: this.crew.workTypeName == undefined ? "" : this.crew.workTypeName,
                    leaderFlag: this.crew.leaderFlag == undefined ? "" : this.crew.leaderFlag,
                    workCardNo: this.workCardNo,
                    workCardEndDate: workCardEndDate,
                    projectId: this.projectId,
                    cardType: this.CertificateType,
                    groupId: this.groupId,
                    groupName: this.groupName,
                    empCode: this.empCode
                };
                console.log(params);
                getPersonnelEdit(params)
                    .then(res => {
                        if (res.code == 200) {
                            this.getDetails(
                                this.detailsIndex,
                                this.detailsRows
                            );
                            this.success(type);
                        } else {
                            this.$Message.warning(res.msg);
                        }
                    })
                    .catch(error => {
                        console.log(error);
                    });
            }
        },
        success(type) {
            this.$Message.success("操作成功");
            this.updateModel = false;
            this.pageNum = type == 0 ? 1 : this.pageNum;
            this.current = type == 0 ? 1 : this.current;
            if (this.gender == undefined) {
                this.gender = "";
            }
            if (this.postState == undefined) {
                this.postState = "";
            }
            if (this.workRole == undefined) {
                this.workRole = "";
            }
            if (this.jobType == undefined) {
                this.jobType = "";
            }
            if (this.corp == undefined) {
                this.corp = "";
            }
            this.getAllList();
            this.getNum();
        },
        //删除
        remove(index, rows) {
            if (rows[index].postState == 1) {
                this.$Modal.warning({
                    title: "提示",
                    content: "该人员还未离职，不能删除！"
                });
                return;
            }
            this.removeID = rows[index].empId;
            this.deleteModal = true;
        },
        detele() {
            getPersonnelRemove(this.removeID)
                .then(res => {
                    if (res.code == 200) {
                        this.$Message.success("操作成功");
                        this.getAllList();
                        this.getNum();
                        this.deleteModal = false;
                    } else {
                        this.$Message.warning(res.msg);
                    }
                })
                .catch(error => {
                    console.log(error);
                });
        },
        //进离职
        enter(index, rows) {
            this.entObj = rows[index];
            this.enterModal = true;
        },
        subEnterTime() {
            let enterTime;
            enterTime = formatInItDate(this.enterTime);
            if (
                new Date(this.entObj.outerTime).getTime() >
                new Date(enterTime).getTime()
            ) {
                this.$Modal.warning({
                    title: "提示",
                    content: "本次入职时间不能小于上次离职时间"
                });
                return;
            }
            let params = {
                empId: this.entObj.empId,
                personId: this.entObj.personId,
                date: enterTime
            };
            getPersonnelEnter(params)
                .then(res => {
                    if (res.code == 200) {
                        this.$Message.success("操作成功");
                        this.pageNum = 1;
                        this.current = 1;
                        this.enterModal = false;
                        this.getNum();
                        this.getAllList();
                    } else {
                        this.$Message.warning(res.msg);
                    }
                })
                .catch(error => {
                    console.log(error);
                });
        },
        outer(index, rows) {
            this.outModal = true;
            this.outObj = rows[index];
        },
        subOutTime() {
            let outerTime;
            outerTime = formatInItDate(this.outerTime);
            if (
                new Date(this.outObj.enterTime).getTime() >
                new Date(outerTime).getTime()
            ) {
                this.$Modal.warning({
                    title: "提示",
                    content: "本次离职时间不能小于上次入职时间"
                });
                return;
            }
            if (this.outObj.sn) {
                this.$Modal.warning({
                    title: "提示",
                    content: "该人员有绑定硬件，不能离职！"
                });
                return;
            }
            let params = {
                empId: this.outObj.empId,
                personId: this.outObj.personId,
                date: this.outTime
            };
            getPersonnelOuter(params)
                .then(res => {
                    if (res.code == 200) {
                        this.$Message.success("操作成功");
                        this.pageNum = 1;
                        this.outModal = false;
                        this.getNum();
                        this.getAllList();
                    } else {
                        this.$Message.warning(res.msg);
                    }
                })
                .catch(error => {
                    console.log(error);
                });
        },
        //解除绑定硬件
        bind(index, rows) {
            console.log("bind click")
            this.bind_sn = "";
            this.bindId = rows[index].empId;
            this.bindModal = true;
        },
        sumBind() {
            if (this.bind_sn == "") {
                this.$Modal.warning({
                    title: "您有必填字段",
                    content: "请输入硬件SN码"
                });
                return;
            }
            let params = {
                empId: this.bindId,
                sn: this.bind_sn
            };
            getPersonnelDevicerBind(params)
                .then(res => {
                    if (res.code == 200) {
                        this.$Message.success("操作成功");
                        this.pageNum = 1;
                        this.bindModal = false;
                        this.getAllList();
                    } else {
                        this.$Message.warning(res.msg);
                    }
                })
                .catch(error => {
                    console.log(error);
                });
        },
        unbind(index, rows) {
            this.unbindID = rows[index].empId;
            this.unbindModal = true;
        },
        sumUnBind() {
            let params = {
                empId: this.unbindID
            };
            getPersonnelDevicerUnbind(params)
                .then(res => {
                    if (res.code == 200) {
                        this.$Message.success("操作成功");
                        this.pageNum = 1;
                        this.unbindModal = false;
                        this.getAllList();
                    } else {
                        this.$Message.warning(res.msg);
                    }
                })
                .catch(error => {
                    console.log(error);
                });
        },
        //取消
        cancel(type) {
            if (type == 1) {
                this.updateModel = false;
            } else if (type == 2) {
                this.deleteModal = false;
            } else if (type == 3) {
                this.bindModal = false;
            } else if (type == 4) {
                this.unbindModal = false;
            } else if (type == 5) {
                this.thisVideo.srcObject.getTracks()[0].stop();
                this.cameraModal = false;
            } else if (type == 6) {
                this.enterModal = false;
            } else if (type == 7) {
                this.outModal = false;
            } else if (type == 8) {
                this.certUpdateModal = false;
            } else if (type == 9) {
                this.certdeleteModal = false;
            } else if (type == 10) {
                this.isAdd = true;
            } else if (type == 11) {
                this.bankUpdateModal = false;
            } else if (type == 12) {
                this.bankdeleteModal = false;
            } else if (type == 13) {
                this.contractdeleteModal = false;
            } else if (type == 14) {
                this.contractUpdateModal = false;
            } else if (type == 15) {
                this.healthModal = false;
            } else if (type == 16) {
                this.confessModal = false;
            } else if (type == 17) {
                this.outBatchModal = false;
            } else if (type == 18) {
                this.userModal = false;
            } else if (type == 100) {
                this.uploadModal = false;
            }
        },
        closeM() {
            this.thisVideo.srcObject.getTracks()[0].stop();
            this.cameraModal = false;
        },
        getcrew() {
            this.idcardIMG = "";
            this.crew.name = "";
            this.crew.phone = "";
            this.crew.gender = 1;
            this.crew.birthday = "";
            this.crew.idCardNo = "";
            this.crew.idCardGrantOrg = "";
            this.crew.headImg = require("./../../assets/images/emp/common/userImage.png");
            this.crew.idCardFront = "";
            this.crew.idCardBack = "";
            this.crew.idCardStartDate = "";
            this.crew.idCardEndDate = "";
            this.crew.nation = "";
            this.crew.address = "";
            this.crew.education = "";
            this.crew.degree = "";
            this.crew.jobTypeId = "";
            this.crew.workRoleId = 2;
            this.crew.workRoleName = "施工人员";
            this.crew.workTypeId = "";
            this.crew.workTypeName = "";
            this.crew.leaderFlag = 0;
            this.crew.avatar = "";
            this.workCardEndDate = "";
            this.workCardNo = "";
            this.groupName = "";
            this.groupId = "";
            this.crew.enterTime = new Date();
            this.empCode = "";
        },

        //添加编辑资格证书
        updateCert(type, index, rows) {
            if (type == 0) {
                this.certIsAdd = true;
                this.certName = "";
                this.level = "";
                this.certCode = "";
                this.certStartDate = "";
                this.certExpireDate = "";
                this.certGrantOrg = "";
                this.imgFileList = [];
            } else if (type == 1) {
                this.certIsAdd = false;
                this.certId = rows[index].certId;
                this.certName = rows[index].certName;
                this.level = rows[index].level;
                this.certCode = rows[index].certCode;
                this.certStartDate = rows[index].certStartDate;
                this.certExpireDate = rows[index].certExpireDate;
                this.certGrantOrg = rows[index].certGrantOrg;
                this.imgFileList = rows[index].fileAttachList || [];
            }
            this.certUpdateModal = true;
        },
        //新增编辑
        updateContract(type, index, rows) {
            if (type == 0) {
                this.contractIsAdd = true;
                this.contract.state = 0;
                this.value = [];
                this.payType = "";
                this.contract.startDate = "";
                this.contract.endDate = "";
                this.contract.contactType = 0;
                this.contract.contractNo = "";
                this.contract.fileAttachList = [];
                this.contract.salary = "";
            } else if (type == 1) {
                this.contractIsAdd = false;
                this.contractId = rows[index].id;
                this.contract.state = rows[index].state;
                this.value = [rows[index].startDate, rows[index].endDate];
                this.payType = rows[index].payType;
                this.contract.startDate = rows[index].startDate;
                this.contract.endDate = rows[index].endDate;
                this.contract.contactType = rows[index].contactType;
                this.contract.contractNo = rows[index].contractNo;
                this.contract.fileAttachList = rows[index].fileAttachList;
                this.contract.salary = rows[index].salary;
            }
            this.contractUpdateModal = true;
        },
        getContractTime(value) {
            this.contract.startDate = value[0];
            this.contract.endDate = value[1];
        },
        getcontractFile(e) {
            var file = document.getElementById("upload_contractfile").files[0];
            var formdata = new FormData();
            formdata.append("file", file, file.name);
            let config = {
                headers: { "Content-Type": "multipart/form-data" }
            };
            getEmpContractUpload(formdata, config)
                .then(res => {
                    if (res.code == 200) {
                        this.contract.fileAttachList.push({
                            name: file.name,
                            url: res.data.path
                        });
                        //上传成功之后清除历史记录
                        document.getElementById("upload_contractfile").value =
                            "";
                    } else {
                        this.$Message.warning(res.msg);
                    }
                })
                .catch(error => {
                    console.log(error);
                });
        },
        contractFile(item) {
            window.open(item.url);
        },
        removecontractFile(index) {
            this.contract.fileAttachList.splice(index, 1);
        },
        // 添加班组
        submitClass() {
            let _IDRe18 = /^(^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$)|(^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])((\d{4})|\d{3}[Xx])$)$/;
            let _IDre15 = /^[1-9]\d{5}\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}$/;
            let _IDMacao = /^[157][0-9]{6}\([0-9Aa]\)/;
            if(this.corpType  == "") {
                this.$Modal.warning({
                    title: "您有必填字段",
                    content: "请选择合作单位"
                });
                return;
            }
            if(this.groupName  == "") {
                this.$Modal.warning({
                    title: "您有必填字段",
                    content: "请填写班组名称"
                });
                return;
            }
            if (this.responsiblePersonPhone != "") {
                if (!/^1[3456789]\d{9}$/.test(this.responsiblePersonPhone)) {
                    this.$Modal.warning({
                        title: "您有必填字段",
                        content: "请填写正确的手机号"
                    });
                    return;
                }
            }
            if (this.responsibleIdcardNumber != "") {
                if (!_IDRe18.test(this.responsibleIdcardNumber) || _IDMacao.test(this.responsibleIdcardNumber)) {
                    this.$Modal.warning({
                        title: "您有必填字段",
                        content: "请填写正确的身份证号码"
                    });
                    return;
                }
            }
            let params ={}
            this.corpList.forEach(i=>{
                if(i.corpId == this.corpType) {
                    this.corpName = i.corpName;
                    this.corpCode = i.corpCode;
                }
            })
            params ={
                corpId:this.corpType,
                corpName:this.corpName,
                groupName:this.groupName,
                responsiblePersonName:this.responsiblePersonName,
                responsiblePersonPhone:this.responsiblePersonPhone,
                responsibleIdcardType:this.responsibleIdcardType,
                responsibleIdcardNumber:this.responsibleIdcardNumber,
                deptId:this.projectId,
                corpCode:this.corpCode,
                groupCode:this.groupCode,
                fvsDeviceId:this.fvsDeviceId.length > 0 ? this.fvsDeviceId[1] : '',
                fvsDeviceName:this.fvsDeviceId.length > 0 ? this.fvsDeviceName : '',
                workTypeId: this.workTypeId,
                workTypeName: this.workTypeName,
            }
            getGroupAdd(params).then(res=>{
                if(res.code == 200) {
                    this.updateModal=false;
                    this.getListTreeList(this.projectId);
                    this.$nextTick(() => {
                        this.$refs.tree.setCurrentKey(this.listTreeData[0].id); //通过设置的ref设置setCurrentKey去渲染tree的默认选中
                    });
                } else {
                    this.$Message.warning(res.msg);
                }
            }).catch(error=>{
                console.log(error)
            })
        },

        safetyHatHide(){
            localStorage.setItem('safetyHatPop',false)
            this.safetyHatShow=false
        },

        /* 同步人员信息 */
        handleSync(value){
            let param = {
                empId: value.empId
            }
            syncEmp(param).then(res=>{
                if(res.code=="200"){
                    this.$Message.success("同步成功");
                }else{
                    this.$Message.warning(res.msg);
                }
            })
        },

        createEmpUser(value){
            console.log('createEmpUser click!')
            // console.log('createEmpUser click! value='+JSON.stringify(value))
            if(value.hasSysUserInfo === true){
                this.isAdd = false
                // this.id = rows[index].id
                // this.getUserDetails(this.id)
                // this.getUserRoles(this.id, this.deptId)
                this.getEmpUserDetails(value.empId)
                this.getEmpUserRoles(value.empId, this.projectId)
            }else{
                this.roleIds = []
                this.tabActiveName = "1"
                this.isAdd = true
                this.username = ""
                this.impKeyword = ""
                this.nickname = ""
                this.password = ""
                this.passwordagain = ""
                this.phone = ""
                this.email = ""
                this.type = "2"
                this.expireTime = ""
                this.improleIds = []

                this.userType = 4

                this.getImportList()
            }
            this.currentEmp = value
            this.userModal = true
        },
        getImportList() {
            let params = {
                deptId: this.projectId,
                pageSize: 10000,
                pageNum: 1,
                keyword: this.impKeyword,
            }
            getEmpUserImporList(params)
                .then((res) => {
                    if (res.code == 200) {
                        this.importList = res.data.list
                        this.impAllList = res.data.list
                    } else {
                        this.$Message.warning(res.msg)
                    }
                })
                .catch((error) => {
                    console.log(error)
                })
        },

        listSelectOne(selection, row) {
            this.improtUserList = selection
        },

        listSelectALL(selection) {
            this.improtUserList = selection
        },
        addEmpUser() {
            if (this.tabActiveName == 1) {
                var reg = new RegExp("^[a-z0-9A-Z]+[- | a-z0-9A-Z . _]+@([a-z0-9A-Z]+(-[a-z0-9A-Z]+)?\\.)+[a-z]{2,}$")
                if (this.username === "") {
                    this.$Modal.warning({
                        title: "您有必填字段",
                        content: "用户名不能为空",
                    })
                    return
                }
                if (this.nickname === "") {
                    this.$Modal.warning({
                        title: "您有必填字段",
                        content: "姓名不能为空",
                    })
                    return
                }
                if (this.phone == "") {
                    this.$Modal.warning({
                        title: "您有必填字段",
                        content: "手机号不能为空",
                    })
                    return
                }
                if (this.phone != "") {
                    if (!(/^1[3456789]\d{9}$/.test(this.phone) || /^[0-9]{8}$/.test(this.phone))) {
                        this.$Modal.warning({
                            title: "您有必填字段",
                            content: "请填写正确的手机号",
                        })
                        return
                    }
                }
                if (this.email == undefined) {
                    this.email = ""
                }
                if (this.email != "") {
                    if (!reg.test(this.email)) {
                        this.$Modal.warning({
                            title: "您有必填字段",
                            content: "请填写正确的邮箱号码",
                        })
                        return
                    }
                }
                if (this.type == 3) {
                    if (this.expireTime == "") {
                        this.$Modal.warning({
                            title: "您有必填字段",
                            content: "请选择到期时间",
                        })
                        return
                    }
                }
                if (this.roleIds.length == 0) {
                    this.$Modal.warning({
                        title: "您有必填字段",
                        content: "请选择账号角色",
                    })
                    return
                }
                if (this.isAdd) {
                    if (this.password === "" || this.passwordagain === "") {
                        this.$Modal.warning({
                            title: "您有必填字段",
                            content: "密码不能为空",
                        })
                        return
                    }
                    if (this.password != this.passwordagain) {
                        this.$Modal.warning({
                            title: "错误",
                            content: "两次输入的密码不一致",
                        })
                        return
                    }
                    this.EmpUserLoading = true;
                    let sysDeptUser = {
                        username: this.username,
                        password: this.password,
                        nickname: this.nickname,
                        phone: this.phone,
                        email: this.email,
                        deptId: this.projectId,
                        type: Number(this.type),
                        expireTime: this.type == 2 ? "" : this.expireTime,
                        roleIds: this.roleIds,
                        userType: this.userType,
                    }
                    let params = {
                        appEmpId:this.currentEmp.empId,
                        sysDeptUser:sysDeptUser
                    }
                    getEmpUserAdd(params)
                        .then((res) => {
                            if (res.code == 200) {
                                this.userModal = false
                                this.$Message.success("操作成功")
                                this.pageNum = 1
                                this.current = 1
                                this.getUserList(this.projectId)
                            } else {
                                this.$Message.warning(res.msg)
                            }
                            this.EmpUserLoading = false;
                        })
                        .catch((error) => {
                            console.log(error)
                            this.EmpUserLoading = false;
                        })
                } else {
                    this.EmpUserLoading = true;
                    let params = {
                        deptId: this.projectId,
                        userId: this.userId,
                        username: this.username,
                        nickname: this.nickname,
                        phone: this.phone,
                        email: this.email,
                        type: Number(this.type),
                        expireTime: this.type == 2 ? "" : this.expireTime,
                        roleIds: this.roleIds,
                    }
                    getDeptUserEdit(params)
                        .then((res) => {
                            if (res.code == 200) {
                                this.userModal = false
                                this.$Message.success("操作成功")
                                this.current = 1
                                this.pageNum = 1
                                this.getUserList(this.projectId)
                            } else {
                                this.$Message.warning(res.msg)
                            }
                            this.EmpUserLoading = false;
                        })
                        .catch((error) => {
                            console.log(error)
                            this.EmpUserLoading = false;
                        })
                }
            } else if (this.tabActiveName == 2) {
                if (this.improtUserList.length == 0) {
                    this.$Modal.warning({
                        title: "您有必填字段",
                        content: "请选择账号",
                    })
                    return
                }
                if (this.improleIds.length == 0) {
                    this.$Modal.warning({
                        title: "您有必填字段",
                        content: "请选择账号角色",
                    })
                    return
                }
                let arr = []
                this.improtUserList.forEach((i) => {
                    arr.push(i.id)
                })
                this.EmpUserLoading = true;
                let params = {
                    empId: this.currentEmp.empId,
                    deptId: this.projectId,
                    userIds: arr,
                    roleIds: this.improleIds,
                }
                getDeptUserImport(params)
                    .then((res) => {
                        if (res.code == 200) {
                            this.userModal = false
                            this.$Message.success("操作成功")
                            this.pageNum = 1
                            this.current = 1
                            this.getUserList(this.projectId)
                        } else {
                            this.$Message.warning(res.msg)
                        }
                        this.EmpUserLoading = false;
                    })
                    .catch((error) => {
                        console.log(error)
                        this.EmpUserLoading = false;
                    })
            }
            this.getAllList();
        },
    },
    mounted() {
        this.projectId = this.$store.state.porjectObject.deptId;
        this.porjectName = this.$store.state.porjectObject.name;
        this.getAllList();
        this.getGroupTree();
        this.getGroupAllList();
        this.getNum();
        this.getworkTypeList(this.projectId);
        this.getEmpConfessUserListFn();
        this.getAllCompangListFn();
        this.btnList = JSON.parse(localStorage.getItem("arr"));
        this.$nextTick(() => {
            this.$refs.tree.setCurrentKey(0);
        });
        setTimeout(() => {
            if (Object.keys(this.$route.params).length > 0) {
                let params = this.$route.params.data;
                if (params.hasOwnProperty("localType")) {
                    if (params.name != "未知") {
                        if (params.localType == 0) {
                            if (
                                this.findTreeChildren(
                                    params.name,
                                    this.listTreeData[0].children
                                )
                            ) {
                                this.expandedKeys.push(this.recursiveValue);
                                this.expandedCheckedKeys = [
                                    this.recursiveValue
                                ];
                                this.$nextTick(() => {
                                    this.$refs.tree.setCurrentKey(
                                        this.recursiveValue
                                    ); //通过设置的ref设置setCurrentKey去渲染tree的默认选中
                                });
                                this.getTreeId(this.recursiveList);
                            }
                        } else if (params.localType == 1) {
                            let findArray = this.listTreeData[0].children.filter(
                                item => {
                                    return item.label == params.name;
                                }
                            );
                            this.expandedKeys.push(findArray[0].id);
                            this.expandedCheckedKeys = [findArray[0].id];
                            this.$nextTick(() => {
                                this.$refs.tree.setCurrentKey(findArray[0].id); //通过设置的ref设置setCurrentKey去渲染tree的默认选中
                            });
                            this.getTreeId(findArray[0]);
                        } else {
                            let workType = this.workList.filter(item => {
                                return item.workTypeName == params.name;
                            });
                            this.getWorkType(workType[0].workTypeId);
                        }
                    }
                } else {
                    let worker = params.name;
                    let workerType = this.workerTypeList.filter(item => {
                        return item.name == worker;
                    });
                    this.getWorkRole(workerType[0].id);
                }
            }
        }, 500)
        this.getcorpList(this.projectId);
        this.getFvsList()
        this.safetyHatShow=localStorage.getItem('safetyHatPop')?JSON.parse(localStorage.getItem('safetyHatPop')):true
        // this.getUserList("")
        this.getRoleList("", "", false)
    }
};
</script>
<style lang="less" scoped>
@import "./../../assets/style/themeBase.less";
.baseItem {
    width: 96%;
    display: flex;
    margin:0 auto;
    justify-content: flex-start;
    align-items: center;
    position: relative;
    margin-bottom:12px;
    padding-left: 16px;
    box-sizing: border-box;
    .tip {
        position: absolute;
        color: red;
        font-size: 16px;
        top:8px;
        left: 0;
    }
    span{
        width: 90px;
    }
}
.emp {
    width: 100%;
    height: 100%;
    padding: 10px;
    box-sizing: border-box;
    background-color: #f5f5f5;
    .content {
        width: 100%;
        height: 100%;
        display: flex;
        justify-content: space-between;
        .right {
            width: calc(100% - 260px);
            // flex: 1;
            height: 100%;
            .top {
                width: 100%;
                padding: 0 20px 20px;
                box-sizing: border-box;
                margin-bottom: 10px;
                background: #fff;
                border-radius: 10px;
                display: flex;
                justify-content: space-between;
                align-items: center;
                flex-wrap: wrap;
                .search {
                    display: flex;
                    flex-wrap: wrap;
                    align-items: center;
                    padding-top: 20px;
                    .list {
                        display: flex;
                        justify-content: flex-start;
                        align-items: center;
                        margin-right: 20px;
                        .ulbox {
                            //width: 210px;
                            height: 32px;
                            list-style: none;
                            display: flex;
                            justify-content: flex-start;
                            border-radius:20px;
                            li {
                                //width: 70px;
                                height: 32px;
                                line-height: 32px;
                                text-align: center;
                                color: var(--themeColor);
                                font-size: 14px;
                                border: 1px solid var(--themeColor);
                                cursor: pointer;
                                padding: 0 15px;
                                box-sizing: border-box;
                            }
                            .active {
                                background: var(--themeColor);
                                color: #ffffff;
                            }
                            li:first-child {
                                border-radius: 20px 0px 0px 20px;
                                border-right: none;
                            }
                            li:last-child {
                                border-radius: 0px 20px 20px 0px;
                                border-left: none;
                            }
                        }
                    }
                }
                .down {
                    padding-top: 20px;
                }
            }
            .bottom {
                width: 100%;
                height: calc(100% - 83px);
                box-sizing: border-box;
                padding: 20px;
                background: #fff;
                border-radius: 10px;
            }
        }
        .left {
            width: 250px;
            height: 100%;
            margin-right: 10px;
            background: #fff;
            border-radius: 10px;
            .ipt {
                width: 100%;
                display: flex;
                justify-content: center;
                align-items: center;
                height: 70px;
                border-bottom: 1px solid #bfbfbf;
            }
            .tree {
                width: 250px;
                margin: 0 auto;
                height: calc(100% - 150px);
                overflow-y: scroll;
            }
            .tree::-webkit-scrollbar {
                display: none;
            }
            /*兼容火狐*/
            .tree {
                scrollbar-width: none;
            }
            /* 兼容IE10+ */
            .tree {
                -ms-overflow-style: none;
            }
        }
    }
    /deep/.el-tree-node.is-current > .el-tree-node__content {
        background-color: var(--themeColor) !important;
        color: #fff !important;
    }
}

.btn {
    cursor: pointer;
}
.avatar {
    width: 100px;
    height: 100px;
    border: 1px solid #000;
    border-radius: 50%;
    img {
        display: block;
        width: 100%;
        height: 100%;
        border-radius: 50%;
    }
}
.avatar_btn {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100px;
    position: relative;
}
.b_box {
    width: 80%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    position: relative;
    padding-left: 16px;
    box-sizing: border-box;

    .tip {
        position: absolute;
        color: red;
        font-size: 16px;
        top:8px;
        left: 0;
    }
}
.cert_box {
    width: 80%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    position: relative;
    margin-bottom: 10px;
    padding-left: 16px;
    box-sizing: border-box;
    span {
        width: 100px;
    }
    .tip {
        width: 10px;
        position: absolute;
        color: red;
        font-size: 16px;
        top:0;
        left:0;
    }
    .radio {
        width: 300px;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    &.img {
        /deep/.avatar-uploader {
            flex: 1;
            display: flex;
            justify-content: flex-start;
            align-items: flex-start;
            flex-wrap: wrap;
        }
        /deep/.el-upload--picture-card {
            width: 60px;
            height: 60px;
            border: 1px dashed #d9d9d9;
            border-radius: 6px;
            cursor: pointer;
            position: relative;
        }
        /deep/.avatar-uploader .el-upload:hover {
            border-color: var(--themeColor);
        }
        /deep/.avatar-uploader-icon {
            font-size: 28px;
            color: #8c939d;
            width: 60px;
            height: 60px;
            line-height: 60px;
            text-align: center;
        }
        /deep/.el-upload--picture-card {
            line-height: 60px !important;
        }
        /deep/.avatar {
            width: 60px;
            height: 60px;
            display: block;
        }
        /deep/.el-upload-list--picture-card .el-upload-list__item {
            width: 60px !important;
            height: 60px !important;
            margin-right: 47px;
            margin-bottom: 10px;
            &:nth-of-type(3) {
                margin-right: 0px;
            }
        }
        /deep/.el-upload-list__item {
            transition: none !important;
        }
    }
}
.dowm {
    width: 90%;
    position: relative;
    ul {
        list-style: none;
        margin-top: 10px;
        color: var(--themeColor);
        cursor: pointer;
        width: 200px;
        li {
            width: 100%;
            display: flex;
            justify-content: space-between;
        }
    }
}
.close {
    position: absolute;
    top: 15px;
    right: 15px;
    cursor: pointer;
}
.titles {
    // border-bottom: 1px solid #e8eaec;
    // margin-bottom: 10px;
    ul {
        width: 100%;
        height: auto;
        display: flex;
        flex-wrap: wrap;
        list-style: none;
        li {
            margin-right: 10px;
            margin-bottom: 10px;
        }
    }
}
h2 {
    font-weight: 400;
    font-size: 14px;
    color: var(--themeColor);
}
.update {
    width: 100%;
    height: auto;
    display: flex;
    justify-content: space-between;
    // margin-top: -10px;
    .left {
        width: 60%;
        height: auto;
        .title {
            display: flex;
            justify-content: flex-start;
            align-items: center;
            height: 40px;
            margin-bottom: 10px;
            .btn {
                display: flex;
                justify-content: flex-start;
                align-items: center;
                margin-left: 20px;
            }
        }
        .list {
            width: 96%;
            margin: 0 auto;
            margin-bottom: 10px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            .item {
                width: 49%;
                height: 32px;
                display: flex;
                justify-content: flex-start;
                align-items: center;
                position: relative;
                .spanActive {
                    width: 200px !important;
                }
                .span1 {
                    width: 90px;
                }
                .tip {
                    color: red;
                    margin-left: 2px;
                }
                .spanbox {
                    width: 200px;
                }
            }
        }
    }
    .right {
        width: calc(40% - 10px);
        // margin-top: 40px;
        height: 658px;
        .title {
            width: 100%;
            margin: 0 auto;
            margin-bottom: 10px;
            display: flex;
            justify-content: space-between;
            align-items: center;
        }
        .img_msg {
            padding-left:30px;
            .tips{
                font-size: 14px;
                font-weight: 400;
                color: #A9B0BB;
                span{
                    color: #FF2727;
                    margin-right:10px;
                }
            }
        }
        .card_msg {
            margin-top: 30px;
            padding-left:30px;
            .item {
                margin-top: 10px;
                position: relative;
                .u_cord {
                    height: 150px;
                    border: 1px solid #c5c8ce;
                    display: flex;
                    justify-content: center;
                    align-items: center;

                    span {
                        font-size: 16px;
                    }
                    img {
                        display: block;
                        height: 100%;
                    }
                }
                /deep/.el-upload {
                    cursor: pointer;
                    position: relative;
                    overflow: hidden;
                }
                /deep/.el-upload-dragger {
                    width: 340px;
                    height: 190px;
                    background: #EFF2F8;
                    border-radius: 0px 0px 0px 0px;
                    img {
                        height: 100%;
                    }
                }
                /deep/ .avatar-uploader-icon {
                    font-size: 28px;
                    color: #8c939d;
                    width: 178px;
                    height: 178px;
                    line-height: 178px;
                    text-align: center;
                }
                /deep/.avatar {
                    width: 300px;
                    height: 150px;
                    display: block;
                }
                /deep/.el-upload__text {
                    display:flex;
                    justify-content:center;
                    align-items: center;
                    line-height:30px;
                    width: 340px;
                    height: 190px;
                    font-size: 18px;
                    font-weight: 400;
                    color: #D8D8D8;
                }
            }
        }
    }
    .tags {
        width: 100%;
        height: auto;
        padding: 10px;
        background: #ffffff;
        border: 1px solid #bfbfbf;
        border-radius: 6px;
        .title {
            border-bottom: 3px solid #e1eafa;
        }
    }
}

.safetyHatPop{
    position: fixed;
    top:0;
    left: 0;
    right: 0;
    bottom: 0;
    background:rgba(51, 51, 51,0.48);
    filter: blur(undefinedpx);
    z-index:110;
    .contentBox{
        width: 600px;
        height:500px;
        background: #FFFFFF;
        box-shadow: 0px 1px 12px 1px rgba(0,0,0,0.1600);
        border-radius: 12px 12px 12px 12px;
        overflow: hidden;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
    }
    .picture{
        height:260px;
        display: flex;
        align-items: center;
        justify-content: center;
        img{
            width:84%;
        }
    }
    .text{
        height:240px;
        font-size:20px;
        font-weight: bold;
        color: #FFFFFF;
        padding:20px 40px 40px;
        background: #4E5969;
        p{
            font-size:16px;
            font-weight: 400;
            color: #FFFFFF;
            line-height:30px;
            margin:10px 0;
        }
    }
    .safetyHatOK{
        width:200px;
        line-height:34px;
        border-radius: 3px;
        border: 1px solid #FFFFFF;
        font-size:14px;
        color: #fff;
        text-align: center;
        cursor: pointer;
        margin:30px auto 0;
    }
}
.hideAdd {
    /deep/ .el-upload--picture-card {
        display: none;
    }
}
/deep/.ivu-input-group{
border-radius:20px;
}
/deep/.ivu-input-group .ivu-input{
    border-radius: 20px 0 0 20px;
    border-color:#EBF2F8;
    background:#EBF2F8;
}
/deep/.ivu-input-group-append{
    border-radius: 0 20px 20px 0;
    // background:#1891FF!important;
}
/deep/.el-tag.el-tag--success{
    background-color: #E7F8F2;
    border-color: #28D79C;
    color: #3FCF77;
}
/deep/.el-tag{
    border-radius: 2px;
}
/deep/.ivu-select-selection{
    border-radius: 2px;
}
.userInfoPicture{
    display:flex;
    justify-content:space-between;
    padding:0 20px;
    .userImage,.userCode{
        width:120px;
        text-align:center;
        img{
            width:120px;
            height:120px;
            border-radius:6px;
        }
    }
}
.userPicture{
    display:flex;
    .img{
        width:120px;
        text-align:center;
        margin-right:20px;
        img{
            width:120px;
            height:120px;
            border-radius:6px;
        }
    }
    .button{
        overflow:hidden;
        .update{
            position:relative;
            margin-bottom:20px;
            input{
                position:absolute;
                top:0;
                left:0;
                bottom:0;
                right:0;
                opacity:0;
                cursor:pointer;
            }
        }
    }
}
</style>

<style scoped>
/* 表单项目样式 */
.item2 {
    width: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-bottom: 10px;
    position: relative;
}
.item2 .tip {
    position: absolute;
    color: red;
    font-size: 16px;
    top: 0;
    left: -10px;
}
.item2 span {
    width: 100px;
}

.top {
    padding: 10px;
}

.imp {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}

/* .table {
    margin-bottom: 10px;
} */

/* 分隔线样式 */
hr {
    border: none;
    height: 1px;
    background-color: #e8eaec;
    margin: 10px 0;
}

/* 角色选择区域样式 */
.checkbox-group {
    display: flex;
    flex-wrap: wrap;
}
.checkbox-item {
    width: 220px;
    margin-bottom: 8px;
}

/* 弹窗标题样式 */
.modal-title {
    font-size: 18px;
    color: var(--themeColor);
    margin: 10px 0;
}
</style>
